Jquery简单分页实现方法
本文实例讲述了Jquery简单分页实现方法。分享给大家供大家参考。具体如下:
js代码:
functiondolistpage(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(){ vartzys=$("#gpinput").val(); varre=/^[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> <tdcolspan="11"> <spanclass="water-table-listbtn"></span> <spanclass="water-table-page"> <spanid="pagemsg"class="water-table-pagemsg">当前0/0页</span> <inputtype="button"id="fpbtn"value="首页"/> <inputtype="button"id="rpbtn"value="上页"/> <inputtype="button"id="npbtn"value="下页"/> <inputtype="button"id="lpbtn"value="尾页"/> <spanid="pagemsg"class="water-table-pagemsg">跳转 <inputtype="text"id="gpinput"size="3"value="0"/>页 </span> <inputtype="button"id="gpbtn"value="跳转"/> </span> </td> </tr> </tfoot> </table>
希望本文所述对大家的jquery程序设计有所帮助。