产生页码：
using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace CommonLib { public class PagingBar { //分页字符 private System.Text.StringBuilder paginationStr = new System.Text.StringBuilder(); //总分页数 private string page_Count; public string Page_Count { set { System.Text.RegularExpressions.Regex re = new System.Text.RegularExpressions.Regex(@"^[1-9]d*$"); if (re.IsMatch(value)) { int data_count = Convert.ToInt32(value); totalCount = data_count; if (data_count % pageSize != 0) { page_Count = string.Format("{0}", data_count / pageSize + 1); } else { page_Count = string.Format("{0}", data_count / pageSize); } } } } private int totalCount = 0; /// <summary> ///页面大小 /// </summary> public int pageSize { get; set; } //当前页的索引 public int pageIndex { get; set; } //原始URL public string baseUrl = string.Empty; //获取所有参数集合 public System.Collections.Hashtable urlParameters = new System.Collections.Hashtable(); // 分页模式: // style1: 10页以内 // 首页 上一页 1 2 3 4 6 7 8 9 10下一页 末页 当前2/共200页 // style2: 10页以上 // 首页 上一页 5 6 7 8 9 10 11 12 13 14 15 16 下一页 末页 当前2/共200页 //style3: //home prev 1 2 3 4 5 6 7 8 9 10 next last public string CreatePagingBar() { try { if (totalCount <= pageSize) { return ""; } urlParameters.Add("page", pageIndex); if (page_Count != null) SetPaginationNumber(Convert.ToInt32(urlParameters["page"])); return paginationStr.ToString(); } catch { return ""; } } public void SetPaginationNumber(int PageIndexNumber) { int page_Count_i = Convert.ToInt32(page_Count); string parmsStr = string.Empty; foreach (var item in urlParameters.Keys) { if (item.ToString() != "page") { parmsStr += "&" + item.ToString() + "=" + urlParameters[item].ToString(); } } paginationStr.Append("<ul id="pagination-flickr">"); //首页 paginationStr.Append(PageIndexNumber != 1 ? string.Format("<li class="next"><a class='pageLink' href="{0}?page={1}{2}">{3}</a></li>", baseUrl, 1, parmsStr, " 首页 ") : ""); //上一页 if (PageIndexNumber < 2) { PageIndexNumber = 1; } paginationStr.Append(string.Format("<li class="next"><a class='pageLink' href="{0}?page={1}{2}">{3}</a></li>", baseUrl, PageIndexNumber == 1 ? 1 : PageIndexNumber - 1, parmsStr, " 上一页 ")); // 数字导航 if (page_Count_i <= 10)//小于10页 无需计算数字分页 { Set_NumStr(1, page_Count_i, PageIndexNumber, parmsStr); } else { if (PageIndexNumber < 5) { Set_NumStr(1, 9, PageIndexNumber, parmsStr); } else if ((PageIndexNumber + 5) > page_Count_i) { Set_NumStr((page_Count_i - 9), page_Count_i, PageIndexNumber, parmsStr); } else { Set_NumStr(PageIndexNumber - 4, PageIndexNumber + 4, PageIndexNumber, parmsStr); } } int currentPage = PageIndexNumber; //下一页 if (PageIndexNumber >= page_Count_i) { PageIndexNumber = page_Count_i - 1; } paginationStr.Append(string.Format("<li class="next"><a class='pageLink' href="{0}?page={1}{2}">{3}</a></li>", baseUrl, (PageIndexNumber + 1).ToString(), parmsStr, " 下一页 ")); //末页 paginationStr.Append(PageIndexNumber != page_Count_i - 1 ? string.Format("<li class="next"><a class='pageLink' href="{0}?page={1}{2}">{3}</a></li>", baseUrl, page_Count_i.ToString(), parmsStr, " 末页 ") : ""); //当前1/共20页 paginationStr.Append(string.Format("<li class="next"><a class='pageLink' href="#"> 当前第{0}页 / 共{1}页 </a></li>", currentPage.ToString(), page_Count_i)); paginationStr.Append("</ul>"); } //设置数字分页字符串 private void Set_NumStr(int BeginNumber, int EndNumber, int PageIndexNumber, string parmsStr) { for (int i = BeginNumber; i <= EndNumber; i++) { paginationStr.Append(string.Format("<li {0}><a class='pageLink' href="{1}?page={2}{3}">{4}</a></li>", i == PageIndexNumber ? "class="currentState"" : "", baseUrl, i.ToString(), parmsStr, i.ToString())); } } } }
页码样式：
.pagination{ overflow:hidden; margin:15px auto; padding:0; _zoom:1; } .pagination *{ display:inline; float:left; margin:0; padding:0; font-size:12px; } .currentPage b{ float:none; color:#f00; } .pagination li{ list-style:none; margin:0px; } .pagination li li{ position:relative; font-family: Arial, Helvetica, sans-serif; margin-right:10px; height:24px; line-height:24px; min-24px; text-align:center; border:1px solid #ccc; background:#efefef; } .firstPage a,.previousPage a,.nextPage a,.lastPage a{ overflow:hidden; height:0; text-indent:-9999em; border-top:1px solid #fff; border-bottom:1px solid #fff; } .pagination li li a { height:24px; line-height:24px; min-24px; text-align:center; background:none; color:#666; } .pagination li li a:hover { height:24px; line-height:24px; min-24px; text-align:center; background:#f60; border-color:#fff; border-color:#f60; color:#fff; } li.firstPage{ border-left:1px solid #06f; } .firstPage a,.previousPage a{ border-right:1px solid #06f; } .firstPage a:hover,.previousPage a:hover{ border-right-color: #f60; } .nextPage a,.lastPage a{ border-left:1px solid #06f; } .nextPage a:hover,.lastPage a:hover{ border-left-color:#f60; } li.lastPage{ border-right:3px solid #06f; } li li.currentState a{ position:relative; height:24px; line-height:24px; min-24px; text-align:center; border-color:#f60; background:#f60; color:#fff; } li.currentState,.currentState a,.currentState a:hover{ border-color:#fff #ccc; cursor:default; height:24px; min-24px; line-height:24px; }
Ajax调用：
using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace WebUI.Ajax { /// <summary> /// MenuHandler 的摘要说明 /// </summary> public class MenuHandler : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string method = context.Request["method"]; if (method == "GetList") { Services.Modules.MenuService service = new Services.Modules.MenuService(); Dictionary<string, object> dic = new Dictionary<string, object>(); Model.CommonModel.PagingSetting ps = new Model.CommonModel.PagingSetting(); ps.SortName = "a.Weight"; ps.Ascending = true; ps.CurrentPageIndex = context.Request["page"] == null ? 1 : Convert.ToInt32(context.Request["page"]); ps.PageSize = 8; List<Model.sys_menu> list = service.GetList(dic, ps); System.Text.StringBuilder strList = new System.Text.StringBuilder(); strList.Append(@"<thead class='clr' > <th>菜单ID</th><th>父菜单</th><th>菜单名称</th><th>排序</th><th>备注</th><th>动作</th> </thead>"); foreach (Model.sys_menu model in list) { strList.AppendFormat(@"<tr class='clr'> <td>{0}</td><td>{1}</td><td>{2}</td><td>{3}</td><td>{4}</td><td>Delete</td> </tr>", model.ID, model.ParentName, model.MenuName, model.Weight, model.Remarks); } System.Web.Script.Serialization.JavaScriptSerializer javascriptserializer = new System.Web.Script.Serialization.JavaScriptSerializer(); CommonLib.PagingBar bar = new CommonLib.PagingBar(); bar.pageSize = ps.PageSize; bar.pageIndex = ps.CurrentPageIndex; bar.Page_Count = ps.TotalItemCount.ToString(); string pagebar = bar.CreatePagingBar(); string r = javascriptserializer.Serialize(new { List = strList.ToString(), Nav = pagebar }); context.Response.Write(r); } } public bool IsReusable { get { return false; } } } }
前端：
<div align="center" class="pagination"> <ul> <li id="Nav"></li> </ul> </div> <script type="text/javascript"> $(function () { GetList("1"); }); function GetList(page) { $.ajax({ url: "../../Ajax/MenuHandler.ashx", data: { "method": "GetList", "page": page }, dataType: "json", success: function (data) { if (data != null) { $(".clr").remove(); $('#tablelist').append(data.List); $("#Nav").html(data.Nav); BindPageLink(); } } }); }; function BindPageLink() { //绑定 超级 a 的点击事件：分页的 $(".pageLink").click(function () { var dataQuery = $(this).attr("href").split('?page=')[1]; GetList(dataQuery) return false; }); }; </script>