分页效果对程序员来所是常见的，但是在这里我介绍的是一个不一样的分页效果，也许你们也长用，偏移量的分页效果，以前学的不精所以研究一好久觉得还是拿出来分享一下吧，同时也让我记住。好了光说大家可定没兴趣，来个效果图吧：
这个效果想必大家不陌生吧。
先介绍一下偏移量的思路吧，也方便我以后好记起，呵呵私心哈，但谁都会有忘性滴。。。
思路第一步：获取总页数，每页显示多少个，当前页码，和样式。在此在这里css样式也作为参数传递了。
思路第二步：上一页，下一页和记录分页位置(分页偏移量)
思路第三步：排除过其他可能性的判断后就是分页的过程考虑了，首先我以10为界限吧，如果当前页<10或者不是最后10页，还有就是正常分页的效果了。我个人就分这三步吧，下面就开始我们的工程吧。
View Code
1 /*------------------------------------分页开始---------------------------------------------*/ 2 /**分页样式1*/ 3 .pages2 { font: 12px Arial, Helvetica, sans-serif;padding:10px 20px 10px 0; margin: 0px;} 4 .pages2 a {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;margin-right:2px} 5 .pages2 a:visited {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;} 6 .pages2 .cpb {padding: 1px 6px;font-weight: bold; font-size: 12px;border:none} 7 .pages2 a:hover {color: #fff; background: #ffa501;border-color:#ffa501;text-decoration: none;} 8 /**分页样式2*/ 9 10 .pages1 .cpb {font-size:12px;background:#1F3A87 none repeat scroll 0 0;border:1px solid #CCCCCC;color:#FFFFFF;font-weight:bold;margin:5px 4px 0 0;padding:4px 5px 0;} 11 .pages1 a {background:#FFFFFF none repeat scroll 0 0;border:1px solid #CCCCCC;color:#1F3A87;margin:5px 4px 0 0;padding:4px 5px 0;text-decoration:none;font-size:12px} 12 .pages1 a:hover{background:#1F3A87 none repeat scroll 0 0;border:1px solid #1F3A87;color:#FFFFFF;font-size:14px} 13 14 /**分页样式3*/ 15 .pages { color: #999; } 16 .pages a, .pages .cpb { text-decoration:none;float: left; padding: 0px 5px; border: 1px solid #ddd;background: #ffff;margin:0 2px; font-size:12px; color:#000;} 17 .pages a:hover { background-color: #E61636; color:#fff;border:1px solid #E61636; text-decoration:none;} 18 .pages .cpb { font-weight: bold; color: #fff; background: #E61636; border:1px solid #E61636;} 19 /*------------------------------------分页结束---------------------------------------------*/
这个是css分页的样式。也是借用别人写的，稍微改一下而已。三种样式随意变换。
protected StringBuilder GetPagerHtml(int total,int size,int page,string css)
{
}利用这个方法来传值/// <summary>
/// 分页效果
/// </summary>
/// <param name="total">总记录数</param>
/// <param name="size">每页显示的条数</param>
/// <param name="page">当前的页码</param>
/// <param name="css">分页效果</param>
/// <returns></returns>
View Code
1 StringBuilder sb = new StringBuilder(); 2 sb.Append(@"<div id=""pager"" class="""+css+ @""">"); 3 //总页数 4 int allpage = 0; 5 if (size != 0) 6 { 7 //整除 8 allpage = total / size; 9 //非整除 10 allpage = ((total % size) != 0 ? allpage+1 : allpage); 11 //和0比较 12 allpage = total == 0 ? 1 : allpage; 13 } 14 //判断页码和总页数 15 if (page > allpage) 16 { 17 page = allpage; 18 } 19 if (page < 1) 20 { 21 page = 1; 22 } 23 24 //上一页和下一页 25 int pre = page - 1; 26 int next = page + 1; 27 28 //记录分页位置(分页偏移量) 29 int startcount = 0; 30 if (startcount <= 0) 31 { 32 startcount = 1; 33 } 34 #region 判断分页 35 /*---------------设置上一页--------------------*/ 36 if (page > 1) 37 { 38 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + pre + @")"" style=""margin-right:5px;"">上一页</a>"); 39 } 40 else 41 { 42 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">上一页</span>"); 43 } 44 #endregion
完成第二步的操作。
下面开始第三步吧，写的有点乱了，，
View Code
1 #region 分页开始 2 if (allpage < 50) 3 { 4 for (int i = 1; i <= allpage; i++) 5 { 6 if (page == i) 7 { 8 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">" + i + @"</span>"); 9 } 10 else 11 { 12 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + i + @")"" style=""margin-right:5px;"">" + i + @"</a>"); 13 } 14 } 15 } 16 else 17 { 18 startcount = (page+10) > allpage? allpage-5 : page-10; 19 20 #region 当前页小于10 21 if (page < 10) 22 { 23 for (int i = 1; i <= 10; i++) 24 { 25 if (page == i) 26 { 27 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">" + i + @"</span>"); 28 } 29 else 30 { 31 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + i + @")"" style=""margin-right:5px;"">" + i + @"</a>"); 32 } 33 } 34 } 35 else { 36 //如果不是最后10页 37 if (page < allpage - 10) 38 { 39 for (int i = startcount; i < startcount + 10; i++) 40 { 41 if (page == i) 42 { 43 sb.Append(@"<span class='cpb' style='margin-right:5px;'>" + i + @"</span>"); 44 } 45 else 46 { 47 sb.Append(@"<a href=""javascript:page(" + i + @")"" style='margin-right:5px;'>" + i + @"</a>"); 48 } 49 } 50 } 51 else 52 { 53 for (int i = allpage - 10; i <= allpage; i++) 54 { 55 if (page == i) 56 { 57 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">" + i + @"</span>"); 58 } 59 else 60 { 61 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + i + @")"" style=""margin-right:5px;"">" + i + @"</a>"); 62 } 63 } 64 } 65 66 } 67 68 #endregion 69 } 70 71 #endregion
嗯第三步完成后就是结尾的部分了
View Code
1 #region 设置下一页 2 /*---------------设置下一页--------------------*/ 3 if (page < allpage) 4 { 5 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + next + @")"" style=""margin-right:5px;"">下一页</a>"); 6 } 7 else 8 { 9 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">下一页</span>"); 10 } 11 #endregion
好了暂时完成，等以后继续修改增加。这个只是有助本人不忘，没别的想法当然如果路过的园友有想法也可以给个意见或建议，或者互相关注大家互相学习共同进步哈,应大家的要求就把源码也整一下吧，其实这就是源码只不过是分步完成了而已，希望能对大家有点帮助。
View Code
1 using System; 2 using System.Collections.Generic; 3 using System.Linq; 4 using System.Web; 5 using System.Web.UI; 6 using System.Web.UI.WebControls; 7 using System.Text; 8 namespace StudyPager 9 { 10 public partial class index : System.Web.UI.Page 11 { 12 protected void Page_Load(object sender, EventArgs e) 13 { 14 if (Request.Form["subflag"] != null && Request.Form["subflag"] != "" && Request.Form["subflag"] == "1") 15 { 16 int p = Convert.ToInt32(Request.Form["p"]); 17 StringBuilder sb = new StringBuilder(); 18 sb.Append(@"<form id=""form1"" action=""index.aspx"" method=""post""> 19 <input type=""hidden"" value=""1"" name=""p""/> 20 <input type=""hidden"" value=""1"" name=""subflag""/> 21 </form>"); 22 sb.Append(this.GetPagerHtml(121, 5, p, "pages1")); 23 this.WebPage.InnerHtml = sb.ToString(); 24 } 25 else 26 { 27 StringBuilder sb = new StringBuilder(); 28 sb.Append(@"<form id=""form1"" action=""index.aspx"" method=""post""> 29 <input type=""hidden"" value=""1"" name=""p""/> 30 <input type=""hidden"" value=""1"" name=""subflag""/> 31 </form>"); 32 sb.Append(this.GetPagerHtml(121, 5, 1, "pages1")); 33 this.WebPage.InnerHtml = sb.ToString(); 34 } 35 } 36 /// <summary> 37 /// 分页效果 38 /// </summary> 39 /// <param name="total">总记录数</param> 40 /// <param name="size">每页显示的条数</param> 41 /// <param name="page">当前的页码</param> 42 /// <param name="css">分页效果</param> 43 /// <returns></returns> 44 protected StringBuilder GetPagerHtml(int total,int size,int page,string css) 45 { 46 StringBuilder sb = new StringBuilder(); 47 sb.Append(@"<div id=""pager"" class="""+css+ @""">"); 48 //总页数 49 int allpage = 0; 50 if (size != 0) 51 { 52 //整除 53 allpage = total / size; 54 //非整除 55 allpage = ((total % size) != 0 ? allpage+1 : allpage); 56 //和0比较 57 allpage = total == 0 ? 1 : allpage; 58 } 59 //判断页码和总页数 60 if (page > allpage) 61 { 62 page = allpage; 63 } 64 if (page < 1) 65 { 66 page = 1; 67 } 68 69 //上一页和下一页 70 int pre = page - 1; 71 int next = page + 1; 72 73 //记录分页位置(分页偏移量) 74 int startcount = 0; 75 if (startcount <= 0) 76 { 77 startcount = 1; 78 } 79 #region 判断分页 80 /*---------------设置上一页--------------------*/ 81 if (page > 1) 82 { 83 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + pre + @")"" style=""margin-right:5px;"">上一页</a>"); 84 } 85 else 86 { 87 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">上一页</span>"); 88 } 89 90 #region 分页开始 91 if (allpage < 150) 92 { 93 for (int i = 1; i <= allpage; i++) 94 { 95 if (page == i) 96 { 97 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">" + i + @"</span>"); 98 } 99 else 100 { 101 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + i + @")"" style=""margin-right:5px;"">" + i + @"</a>"); 102 } 103 } 104 } 105 else 106 { 107 startcount = (page+10) > allpage? allpage-5 : page-10; 108 109 #region 当前页小于10 110 if (page < 10) 111 { 112 for (int i = 1; i <= 10; i++) 113 { 114 if (page == i) 115 { 116 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">" + i + @"</span>"); 117 } 118 else 119 { 120 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + i + @")"" style=""margin-right:5px;"">" + i + @"</a>"); 121 } 122 } 123 } 124 else { 125 //如果不是最后10页 126 if (page < allpage - 10) 127 { 128 for (int i = startcount; i < startcount + 10; i++) 129 { 130 if (page == i) 131 { 132 sb.Append(@"<span class='cpb' style='margin-right:5px;'>" + i + @"</span>"); 133 } 134 else 135 { 136 sb.Append(@"<a href=""javascript:page(" + i + @")"" style='margin-right:5px;'>" + i + @"</a>"); 137 } 138 } 139 } 140 else 141 { 142 for (int i = allpage - 10; i <= allpage; i++) 143 { 144 if (page == i) 145 { 146 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">" + i + @"</span>"); 147 } 148 else 149 { 150 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + i + @")"" style=""margin-right:5px;"">" + i + @"</a>"); 151 } 152 } 153 } 154 155 } 156 157 #endregion 158 } 159 160 #endregion 161 162 163 164 165 166 /*---------------设置下一页--------------------*/ 167 if (page < allpage) 168 { 169 sb.Append(@"<a disabled=""disabled"" href=""javascript:page(" + next + @")"" style=""margin-right:5px;"">下一页</a>"); 170 } 171 else 172 { 173 sb.Append(@"<span class=""cpb"" style=""margin-right:5px;"">下一页</span>"); 174 } 175 #endregion 176 177 sb.Append(@"</div>"); 178 return sb; 179 } 180 } 181 }