本文為原創代碼，轉載請注明出處：http://www.pm-road.com/index.php/2014/07/24/26/

因為web端經常會展示很多數據，如果一頁下來，肯定會看的眼花繚亂，所以肯定會用到分頁的方法；網上會有很多分頁的方法，但像這種情況， 我都會自己去寫這樣方法，而不是照網上的搬過來；以下就是自己封裝的一個方法，非常容易懂，也用做自己以后開發中的一個方法，代碼如下(前提需要引入 JQuery.js)：

/** *?其中會傳入三個參數,另外在代碼中有一個方法beginPostTestResult(page),*?該方法是需要自己寫的方法，該方法的作用就是向后臺發出請求，得回數據的方法； *?@param?page?當前頁 *?@param?maxPage?最大頁 *?@param?divId?你要把這個頁分的顯示放在哪個div中，傳入divId */ function?initPageInfo(page,maxPage,divId){ $("#"+divId).html(""); var?kongge?=?"&nbsp;&nbsp;&nbsp;&nbsp;"; var?firstPage?=?"首頁"; var?prePage?=?"上一頁"; var?endPage?=?"末頁"; var?nextPage?=?"下一頁"; if(page?<?1){ page?=?1; } if(page?>?maxPage?){ page?=?maxPage?; } if(page?==?1?&&?page?<?maxPage){ endPage?=?“<a?href=’javascript:;’?οnclick=’beginPostTestResult(“+maxPage+”)’>末頁</a>”; nextPage?=??“<a?href=’javascript:;’?οnclick=’beginPostTestResult(“+(page+1)+”)’>下一頁</a>”; }else?if(page?>1?&&?page?<?maxPage){ firstPage?=?“<a?href=’javascript:;’?οnclick=’beginPostTestResult(1)’>首頁</a>”; prePage?=?“<a?href=’javascript:;’?οnclick=’beginPostTestResult(“+(page-1)+”)’>上一頁</a>”; endPage?=?“<a?href=’javascript:;’?οnclick=’beginPostTestResult(“+maxPage+”)’>末頁</a>”; nextPage?=??“<a?href=’javascript:;’?οnclick=’beginPostTestResult(“+(page+1)+”)’>下一頁</a>”; }else?if(page?>?1?&&?page?==?maxPage){ firstPage?=?“<a?href=’javascript:;’?οnclick=’beginPostTestResult(1)’>首頁</a>”; prePage?=?“<a?href=’javascript:;’?οnclick=’beginPostTestResult(“+(page-1)+”)’>上一頁</a>”; } $(“#”+divId).html(firstPage+kongge+prePage+kongge+page+kongge+nextPage+kongge+endPage); }

一般情況下，我都會這樣去用此方法：

function beginPostTestResult(page){

$.post(url,{參數},function(data,state,response){

//TODO你的操作

//注意：參數page 都要是×××的，不能是字符型

initPageInfo(page,maxPage,divId);

},”json”);

}

轉載于:https://blog.51cto.com/pmroad/1597704

總結

以上是生活随笔為你收集整理的JS对数据分页的封装方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。