快捷導(dǎo)航

Jquery簡單分頁實(shí)現(xiàn)方法

更新時間：2015年07月24日 15:40:42 作者：罪惡的花生

這篇文章主要介紹了Jquery簡單分頁實(shí)現(xiàn)方法,實(shí)例分析了jquery分頁的相關(guān)實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了Jquery簡單分頁實(shí)現(xiàn)方法。分享給大家供大家參考。具體如下：

js代碼：

function dolistpage(pagerow,pagenum,rowcount,pagecount){
 $("#pagemsg").html("每頁顯示"+pagerow+"條，當(dāng)前" + pagenum + "/" +pagecount + "頁&nbsp;共" +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("請輸入跳轉(zhuǎn)頁數(shù)!");
   $("#gpinput").focus();
   return;
  }
  if (!re.test(tzys)) {
   alert("請輸入正確跳轉(zhuǎn)頁數(shù)!");
   $("#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 class="water-table-listbtn"></span>
    <span class="water-table-page">
     <span id="pagemsg" class="water-table-pagemsg">當(dāng)前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" class="water-table-pagemsg">跳轉(zhuǎn)
     <input type="text" id="gpinput" size="3" value="0"/>頁
     </span>
     <input type="button" id="gpbtn" value="跳轉(zhuǎn)"/>
    </span>
   </td>
  </tr>
 </tfoot>
</table>

希望本文所述對大家的jquery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章: