手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >Jquery简单分页实现方法
Jquery简单分页实现方法
摘要:本文实例讲述了Jquery简单分页实现方法。分享给大家供大家参考。具体如下:js代码:functiondolistpage(pagerow,...

本文实例讲述了Jquery简单分页实现方法。分享给大家供大家参考。具体如下:

js代码:

function dolistpage(pagerow,pagenum,rowcount,pagecount){ $("#pagemsg").html("每页显示"+pagerow+"条,当前" + pagenum + "/" +pagecount + "页共" +rowcount + "条"); if (pagenum == 1) { $("#fpbtn").attr("disabled", true); $("#rpbtn").attr("disabled", true); }else { $("#fpbtn").removeAttr("disabled"); $("#rpbtn").removeAttr("disabled"); } if (pagenum == pagecount) { $("#npbtn").attr("disabled", true); $("#lpbtn").attr("disabled", true); }else { $("#npbtn").removeAttr("disabled"); $("#lpbtn").removeAttr("disabled"); } $("#fpbtn").click(function(){ loadtpage(1); }); $("#rpbtn").click(function(){ loadtpage(pagenum - 1); }); $("#npbtn").click(function(){ if ((pagenum + 1) >= pagecount) loadtpage(pagecount); else loadtpage(pagenum + 1); }); $("#lpbtn").click(function(){ loadtpage(pagecount); }); $("#gpbtn").click(function(){ var tzys = $("#gpinput").val(); var re = /^[1-9]+[0-9]*$/; if (tzys == null || tzys == undefined || tzys == '') { alert("请输入跳转页数!"); $("#gpinput").focus(); return; } if (!re.test(tzys)) { alert("请输入正确跳转页数!"); $("#gpinput").focus(); return; } if (tzys > pagecount) tzys = pagecount; if (tzys <= 0) tzys = 1; loadtpage(tzys); }); $("#gpinput").val(pagenum); }

HTML代码:

<table> <tfoot> <tr> <td colspan="11"> <span></span> <span> <span id="pagemsg">当前0/0页</span> <input type="button" id="fpbtn" value="首页"/> <input type="button" id="rpbtn" value="上页"/> <input type="button" id="npbtn" value="下页"/> <input type="button" id="lpbtn" value="尾页"/> <span id="pagemsg">跳转 <input type="text" id="gpinput" size="3" value="0"/>页 </span> <input type="button" id="gpbtn" value="跳转"/> </span> </td> </tr> </tfoot> </table>

希望本文所述对大家的jquery程序设计有所帮助。

【Jquery简单分页实现方法】相关文章:

jQuery实现自动滚动到页面顶端的方法

使用JavaScript刷新网页的方法

jquery预加载图片的方法

jquery简单实现外部链接用新窗口打开的方法

javascript模拟评分控件实现方法

Jquery实现动态切换图片的方法

jQuery实现延迟跳转的方法

JQuery+CSS实现图片上放置按钮的方法

JavaScript模版引擎的基本实现方法浅析

JS动态增删表格行的方法

精品推荐
分类导航