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程序设计有所帮助。