表格翻页的实现方式有很多,下面以js为例为大家详细介绍下表格翻页效果的具体实现。
<script language="JavaScript"> <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("[^;]?" + arguments[0] + "=([^;]*)(?=;||$)","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></script>
共 6 页 当前第 1 页
第一页
上一页
下一页
最后一页
转到第页
| 标题 |
| 1 |
| 2 |
| 3 |
| 4 |
| 5 |
| 6 |
| 7 |
| 8 |
| 9 |
| 10 |
| 11 |
| 12 |
| 13 |
| 14 |
| 15 |
| 16 |
| 17 |
| 18 |
| 19 |
| 20 |
| 21 |
| 22 |
| 23 |
| 24 |











