表格翻页的实现方式有很多,下面以js为例为大家详细介绍下表格翻页效果的具体实现。 复制代码 代码如下: 表格翻页---www.jb51.net <BR>body, td{ <BR>font-size: 9pt; <BR>} <BR>a:link { <BR>color: #FF0000; <BR>} <BR>a:visited { <BR>color: #FF0000; <BR>} <BR>a:hover { <BR>color: #006600; <BR>} <BR> <BR><!-- <BR>var record = 4;//每页显示多少条记录 <BR>var count = 24;//记录总数 <BR>var pageTotal = ((count+record-1)/record)|0;//总页数 <BR>var pagenum = 1;//将要显示的页码 <br><br><BR>Cookie = { <BR>Set : function (){ <BR>var name = arguments[0], value = escape(arguments[1]), days = 365, path = "/"; <BR>if(arguments.length > 2) days = arguments[2]; <BR>if(arguments.length > 3) path = arguments[3]; <BR>with(new Date()){ <BR>setDate(getDate()+days); <BR>days=toUTCString(); <BR>} <BR>document.cookie = "{0}={1};expires={2};path={3}".format(name, value, days, path); <BR>}, <BR>Get : function (){ <BR>var returnValue=document.cookie.match(new RegExp("[\b\^;]?" + arguments[0] + "=([^;]*)(?=;|\b|$)","i")); <BR>return returnValue?unescape(returnValue[1]):returnValue; <BR>} <BR>} <BR>String.prototype.format = function(){ <BR>var tmpStr = this; <BR>var iLen = arguments.length; <BR>for(var i=0;i<iLen;i++){ <BR>tmpStr = tmpStr.replace(new RegExp("\\{" + i + "\\}", "g"), arguments[i]); <BR>} <BR>return tmpStr; <BR>} <BR>function setPagenum(){//整理Cookie <BR>pagenum = Cookie.Get("pagenum"); <BR>if(pagenum=="" || pagenum<1){ <BR>pagenum=1; <BR>} <BR>} <br><br>setPagenum(); <br><br>//重新整理当前页码,如果页面小于1,则赋值为1,如果大于总页数,则等于总页数 <BR>coordinatePagenum(pagenum); <br><br>//根据当前要显示的页码取得当前面里第一条记录的号码 <BR>var pageBegin = (record*(pagenum-1)+1)|0; <br><br>//根据当前要显示的页码取得当前面里最后一条记录的号码 <BR>var pageEnd = record*pagenum; <br><br>function showhiddenRecord(pagenum){ <BR>number.innerHTML=pagenum; <BR>if(pagenum<=1){ <BR>theFirstPage.innerHTML="第一页"; <BR>thePrePage.innerHTML="上一页"; <BR>}else{ <BR>theFirstPage.innerHTML="<a href=\"javascript:firstPage()\">第一页"; <BR>thePrePage.innerHTML="<a href=\"javascript:prePage()\">上一页"; <BR>} <BR>if(pagenum>=pageTotal){ <BR>theNextPage.innerHTML="下一页"; <BR>theLastPage.innerHTML="最后一页"; <BR>}else{ <BR>theNextPage.innerHTML="<a href=\"javascript:nextPage()\">下一页"; <BR>theLastPage.innerHTML="<a href=\"javascript:lastPage()\">最后一页"; <BR>} <BR>document.getElementById('goto').value=pagenum; <BR>//根据当前要显示的页码取得当前面里第一条记录的号码 <BR>pageBegin = (record*(pagenum-1)+1)|0; <br><br>//根据当前要显示的页码取得当前面里最后一条记录的号码 <BR>pageEnd = record*pagenum; <BR>for(var i=1;i<=count;i++){ <BR>if(i>=pageBegin && i<=pageEnd){ <BR>mytable.rows[i].style.display=""; <BR>}else{ <BR>mytable.rows[i].style.display="none"; <BR>} <BR>} <BR>Cookie.Set("pagenum", pagenum); <BR>} <br><br>function firstPage(){ <BR>pagenum=1; <BR>showhiddenRecord(pagenum); <BR>} <br><br>function lastPage(){ <BR>showhiddenRecord(pageTotal); <BR>} <br><br>//重新整理当前页码,如果页面小于1,则赋值为1,如果大于总页数,则等于总页数 <BR>function coordinatePagenum(num){ <BR>if(num<1){ <BR>num="1"; <BR>}else if(num>pageTotal){ <BR>num=pageTotal; <BR>} <BR>} <br><br>function prePage(){ <BR>pagenum--; <BR>coordinatePagenum(pagenum); <BR>showhiddenRecord(pagenum); <BR>} <br><br>function nextPage(){ <BR>pagenum++; <BR>coordinatePagenum(pagenum); <BR>showhiddenRecord(pagenum); <BR>} <br><br>function gotoPage(num){ <BR>coordinatePagenum(pagenum); <BR>showhiddenRecord(num); <BR>} <BR>//--> <BR> 共 6 页 当前第 1 页 第一页 上一页 下一页 最后一页 转到第 1 2 3 4 5 6 页 标题 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24