Jquery単純ページング実装方法
2028 ワード
この例では、Jqueryの簡単なページングの実装方法について説明します.皆さんの参考にしてください.具体的には以下の通りです.
jsコード:
HTMLコード:
ジャンプ
ページ
本稿で述べた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コード:
現在0/0ページジャンプ
ページ
本稿で述べたjqueryプログラム設計に役立つことを願っています.