asp.net分页效果实现(使用js)
效果如图:
代码如下:
//分页 function UpdatePage(jsontext) { //总条数(总条数=总页数*页大小) var userCount = jsontext.userCount; //总页数 var pagecount = jsontext.pagecount; //当前页 var pindex = jsontext.pindex; if (pagecount > 1) { sailstr = "<ul class=\"table_page_ul\">"; if (pindex == 1) { sailstr += ""; } else { sailstr += "<li class=\"prev\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + (pindex - 1) + ")\"></a></li>"; } if (Number(pagecount) >= 5) { if (pindex == 1) { for (var i = 1; i < 6; i++) { if (i == pindex) { sailstr += "<li class=\"numon\"><a href=\"javascript:void(0)\">" + i + "</a></li>"; } else { sailstr += "<li class=\"num\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + i + ")\">" + i + "</a></li>"; } } } else if ((Number(pindex) + 4) - Number(pagecount) > 0) { for (var i = Number(pagecount) - 4; i < Number(pagecount) + 1; i++) { if (i == pindex) { sailstr += "<li class=\"numon\"><a href=\"javascript:void(0)\">" + i + "</a></li>"; } else { sailstr += "<li class=\"num\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + i + ")\">" + i + "</a></li>"; } } } else { for (var i = (Number(pindex) - 1); i < (Number(pindex) + 4); i++) { if (i == pindex) { sailstr += "<li class=\"numon\"><a href=\"javascript:void(0)\">" + i + "</a></li>"; } else { sailstr += "<li class=\"num\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + i + ")\">" + i + "</a></li>"; } } } } else { for (var i = 1; i < Number(pagecount) + 1; i++) { if (i == pindex) { sailstr += "<li class=\"numon\"><a href=\"javascript:void(0)\">" + i + "</a></li>"; } else { sailstr += "<li class=\"num\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + i + ")\">" + i + "</a></li>"; } } } if (pindex == pagecount) { sailstr += "</ul>"; } else { sailstr += "<li class=\"next\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + (Number(pindex) + 1) + ")\"></a></li></ul>"; } } else { sailstr = ""; } //PageTab是页码显示的div $("#PageTab").html(sailstr); } //页码单击事件 function GetPage(){ //写点击页面执行的内容 }
解释:如上代码函数function UpdatePage(jsontext){}为分页的主要部分,函数要传入一json形式的数据。
包括userCount(总条数)、pagecount(总页数)、pindex(当前页)。