整合營銷服務商
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
段時候寫IM即時通訊的時候，要對用戶的聊天記錄進行分頁，于是就寫了一個對聊天記錄進行分頁的公告函數(shù)，嗯，的確很好用！
eg：
首先要考慮這個對數(shù)組進行分頁的函數(shù)要接收的參數(shù)，在此我的是：
function pagination (pageNo, pageSize, origin) {
}
有了這三個參數(shù)，我們已經可以實現(xiàn)數(shù)組分頁了，再此我主要使用的是 JS 數(shù)組的 slice 方法，因為 splice 的話，會改變原數(shù)組。
slice() 方法可從已有的數(shù)組中返回選定的元素。
語法
arrayObject.slice(start,end)
首先我們需要確定切片的起始位置，因為是從0開始，所以需要減1，然后用得到的結果乘以pageSize每頁數(shù)量就可以得到分頁的起始位置。
得到了 pageSize 之后，我們只需要得到 end 切片終止位置即可。
用起始位置加上pageSize就可以得到。
function pagination (pageNo, pageSize, origin) {
// 獲取切片的起始位置
const originSection=(pageNo - 1) * pageSize
const currentPage=origin.slice(originSection, originSection + pageSize)
}
PS: 如果要切的起始位置大于當前數(shù)組的總長度，是切不到的，只會得到空數(shù)組，所以我們不需要做多余處理。
核心已經實現(xiàn)了，接下來稍微完善一下即可；我們可以把總頁數(shù)，總長度等一并返回：
源碼;
開發(fā)過程中，經常做的一件事，也是最基本的事，就是從數(shù)據(jù)庫中查詢數(shù)據(jù)，然后在客戶端顯示出來。當數(shù)據(jù)少時，可以在一個頁面內顯示完成。然而，如果查詢記錄是幾百條、上千條呢？直接一個頁面顯示完全的話，表格得多長啊。。。。。。這時，我們可以用分頁技術。
何為分頁？效果圖如下：
這里總共查詢了100條記錄，如果一次性顯示的話表格會很多行，用戶體驗不佳。而我們采用分頁顯示的話，一頁顯示10條記錄，共十頁。用戶可以自行翻閱，記錄少，清晰顯示。
下面談談分頁效果的實現(xiàn)，思路有三種：
其一：純JS實現(xiàn)分頁。一次性查詢記錄并加載到html的table中。然后通過選擇性地顯示某些行來達到分頁顯示的目的。這是一種偽分頁，障眼法而已。只能用于數(shù)據(jù)少的情況下。一旦數(shù)據(jù)多了，十幾萬條數(shù)據(jù)加載到html中會變得很慢。而且不實時，一次加載完后數(shù)據(jù)就寫死在頁面了，若數(shù)據(jù)庫中有變化，瀏覽器端顯示的仍是上次加載過來的數(shù)據(jù)。
首先：用table來顯示查詢出來的記錄們，全部顯示。
<table width="500" id="idData">
<%
String user_id, user_name, user_sex, user_phone, user_age;
while (sqlRst.next()) {
user_id=sqlRst.getString(1);
user_name=sqlRst.getString(2);
user_sex=sqlRst.getString(3);
user_phone=sqlRst.getString(4);
user_age=sqlRst.getString(5);
%>
<tr>
<td><%=user_id%></td>
<td><%=user_name%></td>
<td><%=user_sex%></td>
<td><%=user_phone%></td>
<td><%=user_age%></td>
</tr>
<%
}
%>
</table>
<br/>
<table width="60%" align="right">
<tr><td><div id="changePages" name="changePages"></div></td></tr>
</table>
然后，在JS中修改table中某些行顯示，某些行隱藏。
<script type="text/javascript">
function goPage(pno,psize){
var itable=document.getElementById("idData");//獲取table
var num=itable.rows.length;//得到記錄總數(shù)
var totalPage=0;
var pageSize=psize;//一頁顯示pageSize條記錄
//計算總頁數(shù)
if(num/pageSize > parseInt(num/pageSize)){
totalPage=parseInt(num/pageSize)+1;
}else{
totalPage=parseInt(num/pageSize);
}
//當前頁數(shù)
var currentPage=pno;
//獲取當前頁第一條、最后一條記錄的行號
var startRow=(currentPage - 1) * pageSize+1;
var endRow=currentPage * pageSize;
endRow=(endRow > num)? num : endRow;
//修改table中當前頁對應的行的屬性為顯示，非本頁的記錄為隱藏
for(var i=1;i<(num+1);i++){
var irow=itable.rows[i-1];
if(i>=startRow && i<=endRow){
irow.style.display="block";
}else{
irow.style.display="none";
}
}
//分頁頁碼列表
var tempStr="共"+num+"條記錄 分"+totalPage+"頁 當前第"+currentPage+"頁";
if(currentPage>1){
tempStr +="<a href=\"#\" onClick=\"goPage("+(1)+","+psize+")\">首頁</a>";
tempStr +="<a href=\"#\" onClick=\"goPage("+(currentPage-1)+","+psize+")\"><上一頁</a>"
}else{
tempStr +="首頁";
tempStr +="<上一頁";
}
if(currentPage<totalPage){
tempStr +="<a href=\"#\" onClick=\"goPage("+(currentPage+1)+","+psize+")\">下一頁></a>";
tempStr +="<a href=\"#\" onClick=\"goPage("+(totalPage)+","+psize+")\">尾頁</a>";
}else{
tempStr +="下一頁>";
tempStr +="尾頁";
}
document.getElementById("changePages").innerHTML=tempStr;
}
</script>
其二：一次查詢，分批顯示。
就是說，我們可以執(zhí)行一個數(shù)據(jù)庫查詢操作，得到結果集rs。然后，通過指針的移動來顯示當前頁面的記錄。這樣，就可以以 rs.absolute(當前頁面號*每頁記錄數(shù))定位到當前頁的第一條記錄，然后通過while循環(huán)顯示n條記錄（n為每頁顯示記錄數(shù)）。在跳頁時，只需修改currentPage，即可在重定位到下一頁時把當前頁面號改掉，重新定位記錄指針，通過while遍歷顯示n條記錄。與JS選擇性顯示不同，這里是選擇性遍歷。與JS分頁不同的是，這里分頁每次跳頁修改的是遍歷的指針，每次跳頁都要進行一次全面查詢。同樣地，不適合大數(shù)據(jù)量查詢。這里比JS分頁優(yōu)化的地方在于——實時性。每次跳頁都會查詢一次數(shù)據(jù)庫，保證數(shù)據(jù)的實時性。
參考代碼：
<%
int intPageSize=10; //一頁顯示的記錄數(shù) int intRowCount; //記錄總數(shù)
int intPageCount; //總頁數(shù)
String strPage; //從表單或URL傳送的待顯示頁碼
int intPage; //待顯示頁碼 ，由strPage轉換成的整數(shù)
//---計算記錄總數(shù)的第一種方法：查詢出所有記錄，移動結果集指針到最后一條，獲取最后一條記錄的行號
//查詢所有數(shù)據(jù) ResultSet sqlRst=sqlStmt.executeQuery("select * from user");
//獲取記錄總數(shù)
sqlRst.last(); //光標在最后一行
intRowCount=sqlRst.getRow(); //獲得當前行號，即總記錄數(shù)
//記算總頁數(shù)
intPageCount=(int)Math.ceil(intRowCount/(intPageSize*1.0));
//將記錄指針定位到待顯示頁的第一條記錄上
sqlRst.absolute((intPage - 1) * intPageSize + 1);
//顯示數(shù)據(jù)
int i=0;
String user_id, user_name, user_sex, user_phone, user_age;
while (i < intPageSize && !sqlRst.isAfterLast()) {
user_id=sqlRst.getString(1);
user_name=sqlRst.getString(2);
user_sex=sqlRst.getString(3);
user_phone=sqlRst.getString(4);
user_age=sqlRst.getString(5);
%>
<tr>
<td><%=user_id%></td>
<td><%=user_name%></td>
<td><%=user_sex%></td>
<td><%=user_phone%></td>
<td><%=user_age%></td>
</tr>
<%
sqlRst.next();//移動記錄指針指向下一條記錄
i++;//統(tǒng)計當前頁已顯示多少條記錄
}
%>
其三：在服務端分頁。跳到第n頁才查詢、顯示第n頁內容。要點就是根據(jù)客戶端表格的“頁面”計算出數(shù)據(jù)庫要查詢的當前頁面的第一條記錄的位置。優(yōu)點：實時性：跳頁才查詢。數(shù)據(jù)量小：只加載當前頁的記錄進行顯示。
重點在于兩條語句：select count(*) from ...:查詢得到記錄總條數(shù)
select * from .. limit pageNo,rowsCount:查詢從第pageNo條開始的rowsCount條數(shù)據(jù)。
int pages=0; //待顯示頁面
int count=0; //總條數(shù)
int totalpages=0; //總頁數(shù)
int limit=10; //每頁顯示記錄條數(shù)
//計算記錄總數(shù)的第二種辦法：使用mysql的聚集函數(shù)count(*)
ResultSet sqlRst=sqlStmt.executeQuery("select count(*) from user");
if(sqlRst.next()){
count=sqlRst.getInt(1);//結果為count(*)表，只有一列。這里通過列的下標索引（1）來獲取值
}
//由記錄總數(shù)除以每頁記錄數(shù)得出總頁數(shù)
totalpages=(int)Math.ceil(count/(limit*1.0));
//獲取跳頁時傳進來的當前頁面參數(shù)
String strPage=request.getParameter("pages");
//判斷當前頁面參數(shù)的合法性并處理非法頁號（為空則顯示第一頁，小于0則顯示第一頁，大于總頁數(shù)則顯示最后一頁）
if (strPage==null) {
pages=1;
} else {
try{
pages=java.lang.Integer.parseInt(strPage);
}catch(Exception e){
pages=1;
}
if (pages < 1){
pages=1;
}
if (pages > totalpages){
pages=totalpages;
}
}
//由(pages-1)*limit算出當前頁面第一條記錄，由limit查詢limit條記錄。則得出當前頁面的記錄
sqlRst=sqlStmt.executeQuery("select * from user order by user_id limit " + (pages - 1) * limit + "," + limit);
while (sqlRst.next()){//遍歷顯示}
跳頁的實現(xiàn)：跳頁是通過重定向來實現(xiàn)的，通過向當前網(wǎng)頁傳進待顯示的pages，在跳轉后根據(jù)pages重新算出頁面顯示的第一條，查limit條顯示。
<form name="f1" method="POST" action="index.jsp" onSubmit="return checknum()">
<table border="0" align="center" >
<tr>
<td>第<%=pages%>頁 共<%=totalpages%>頁 <a href="index.jsp?pages=1">首頁</a></td>
<td><a href="index.jsp?pages=<%=(pages<1)?pages:(pages-1) %>"> 上一頁</a></td>
<td><a href="index.jsp?pages=<%=(pages>=totalpages)?totalpages:(pages+1)%>"> 下一頁</a></td>
<td><a href="index.jsp?pages=<%=totalpages%>">最后一頁</a></td>
<td>轉到第:<input type="text" name="page" size="8">頁<input type="submit" value="GO" name="cndok"></td>
</tr>
</table>
</form>
附：常見數(shù)據(jù)庫分頁查詢語句
1.oracle數(shù)據(jù)庫分頁
select * from (select a.*,rownum rc from 表名 where rownum<=endrow) a where a.rc>=startrow
2.DB2數(shù)據(jù)庫分頁
Select * from (select rownumber() over() as rc,a.* from (select * from 表名 order by列名) as a) where rc between startrow and endrow
3.SQL Server 2000數(shù)據(jù)庫分頁
Select top pagesize * from 表名 where 列名 not in(select top pagesize*page 列名 from 表名 order by列名) order by列名
4.SQL Server 2005數(shù)據(jù)庫分頁
Select * from (select 列名,row_number() over(order by 列名1) as 別名from 表名) as t where t.列名1>=startrow and t.列名1<=endrow
5.MySQL數(shù)據(jù)庫分頁
Select * from 表名 limit startrow,pagesize
(Pagesize為每頁顯示的記錄條數(shù))
6.PostgreSQL數(shù)據(jù)庫分頁
Select * from 表名 limit pagesize,offset startrow
(Pagesize為每頁顯示的記錄條數(shù))
轉載請注明原文地址：http://www.cnblogs.com/ygj0930/p/6134851.html
項目開發(fā)過程中，分頁是少不了的，之前封裝了一個分頁組件，樣式是基于bootstrap的樣式，當然也可以自己來修改；
別的不說，上圖上代碼；
bootstrap樣式分頁
以下是相關代碼：
/***=======================分頁樣式==================================***/
/*分頁樣式*/
.page{
display:inline-block;
width:100%;
text-align:center;
height:35px;
line-height:35px;
background-color:none;
}
.page .pagination{
margin:0px !important;
}
.page .pagination li a{
/*修改按鈕樣式*/
border:none !important;
background-color:transparent; !important;
color:#555;
cursor:pointer;
}
.page .pagination li a:hover,.page .pagination li a:focus,.page .pagination li a:active{
background-color:#ccc;
}
.page .pagination li.active a,.page .pagination li.active a:hover,.page .pagination li a:active,.page .pagination li a:focus{
color:#0099ff;
cursor:default;
background-color:none;
}
.pageinfo{
display:none !important;
}
/*隱藏分頁信息*/
.clickmore{ cursor:pointer; }
.pagination>.action>a:hover,.pagination>.action>a:focus{ color:#0099ff !important; cursor:default; }
/****======================分頁樣式結束============================***/上面是自己寫的分頁樣式，可自行修改之，下面是分頁組件代碼：
/**
* bootstrap 對應的獨立分析組件
* @demo
* pagination.init({
* selector : '.page', //選擇器，作為渲染目標,默認為 '.page.pagination',非必須
* count : 120, //為總記錄數(shù)，必須
* isTransform : false,//是否轉換為符合后臺需要的參數(shù)begin /end
* page : 1, //為當前頁碼，非必須
* pagesize : 10, //為每頁條數(shù)，默認10，非必須
* increment : 10, //為頁面存在的分頁增量，比如只顯示5個頁碼，非必須
* pageArray : [], //可以進行生成下拉框，比如 10，20，50 ，選擇不同的頁碼進行分頁，非必須
* previousTitle : '點擊查看',//為上一頁的title顯示，未實現(xiàn)；
* callback : function(pageObject){//為分頁點擊回調函數(shù)，必須
* console.log(pageObject);//pageObject={page : 1,pagesize:10};回調函數(shù)返回值，包括下一個頁碼和每頁條數(shù)
* }
* });
* @since 2016年2月15日 15:18:36
* @author lixun
* @version 1.0
* @edited by lixun ,增加多實例；一個頁面多個分頁 ；
* 處理思路：
* 1\. 對應的每個selector有一個pagination,然后在調用的時候根據(jù)selector進行查找
* 2\. 處理的內容：1）分頁加載；2）事件綁定 3）回調函數(shù)
* 3\. 處理原則：平滑處理，原有的可繼續(xù)使用；
*/
var pagination={
_defaultSelector : '.page .pagination', //默認選擇器
_defaultPagesize : 20, //默認分頁條數(shù)
_defaultIncrement : 10, //默認分的頁碼數(shù)
_defaultPageArray : [10,20,50,100], //默認的條碼下拉框
_map : { //用戶處理多實例增加的容器，不可覆蓋
//selector : {私有屬性}
//".page .column" : {}
},
//通用屬性
lastSelector : '',//上一個選擇器，用于開發(fā)者不傳遞參數(shù)的時候，去查找上一個選擇器用的。
previousTitle : '上一頁',
nextTitle : '下一頁',
previousContent : '上一頁',
nextContent : '下一頁',
//獲得分頁實例
_getPagination : function(selector){
if(null !=selector && selector !='' && $(selector).length > 0){
return pagination._map[selector];
}else{
console.error('selector 傳參錯誤或$('+selector+')不存在!');
}
return null;
},
//獲得返回的字符串
pageArrayStr : function(selector,ps){
var pa=pagination._map[selector].pageArray;
if(null !=pa && pa.length > 0){
var concatStr='<select onchange="pagination.changePagesize(\''+(selector)+'\',event)" style="height:20px;line-height:20px;padding:0px;margin-top:-2px;">';
var i=0,max=pa.length;
for(;i<max;i++){
var v=pa[i];
concatStr +='<option value="'+v+'" '+(v==ps ? 'selected="true"' : '')+'>'+v+'</option>';
}
concatStr +='</select>';
return concatStr;
}
return "";
},
//綁定事件
bindEvent : function(selector){
if(selector && selector !=''){
var _tempPaginationInstance=pagination._map[selector] || {};
var _bindE=_tempPaginationInstance.bindE==true ? true : false;
if(_bindE==false){
_tempPaginationInstance.bindE=true;
pagination._map[selector]=_tempPaginationInstance;
//跳轉頁面
$(selector).delegate('li.unselect','click',pagination.clickpage);
//綁定上一頁事件
$(selector).delegate('li.pageup','click',pagination.pageup);
//綁定下一頁事件
$(selector).delegate('li.pagedown','click',pagination.pagedown);
//綁定前面頁面事件
$(selector).delegate('a.previous','click',pagination.previouspage);
//綁定后面頁面事件
$(selector).delegate('a.next','click',pagination.nextpage);
}
}
},
//分頁初始化
init : function(params){
//處理傳參數(shù)據(jù)
params=params || {};
params.count=params.count || 0;
params.pagesize=params.pagesize || pagination._defaultPagesize;
var paramSelector=pagination._defaultSelector;
if(params.selector){
paramSelector=params.selector;
}
//獲得選擇器后，進行實例處理
var paginationInstance=pagination._getPagination(paramSelector);
//傳參獲取最新配置
var tempPaginationInstance={
selector : paramSelector,
page : params.page ? params.page : (paginationInstance && paginationInstance.action==true ? (paginationInstance.page ? paginationInstance.page : 1) : 1),
count : params.count || 0,
action : false,
bindE : false,//是否綁定事件
pagesize : params.pagesize,
callback : params.callback || $.noop,
pagenumber : (parseInt((params.count || 0)/(params.pagesize||pagination._defaultPagesize),10)+((params.count||0)%(params.pagesize||pagination._defaultPagesize)==0 ? 0 : 1)),//根據(jù)總數(shù)和一頁條數(shù)獲得頁碼數(shù)量
increment : params.increment || pagination._defaultIncrement,
pageArray : params.pageArray || pagination._defaultPageArray
};
if(paginationInstance && undefined !=paginationInstance){
//存在實例,進行更新。
tempPaginationInstance.bindE=true;//如果存在的話，肯定綁定了
pagination._map[paramSelector]=$.extend(paginationInstance,tempPaginationInstance);
}else{
pagination._map[paramSelector]=tempPaginationInstance;//重新賦值
pagination.bindEvent(paramSelector);//綁定事件
}
pagination.loadPage(paramSelector);
pagination.lastSelector=paramSelector;
},
//點擊頁面數(shù)直接跳轉
clickpage : function(){
var $a=$(this).find('a');
var selector=$a.attr('selector');
var gonumber=parseInt($a.html(),10);
$(selector+' li.active').addClass('unselect').removeClass('active');
$(this).addClass('active').removeClass('unselect');
pagination.gopage(selector,gonumber);
},
//向上翻頁
pageup : function(){
var $a=$(this).find('a');
var selector=$a.attr('selector');
var _tempInstance=pagination._map[selector];
if(_tempInstance){
//得到當前頁面，然后翻頁，如果在邊界，那么就要進行觸發(fā)一次翻頁事件
var $actel=$(selector+' li.active a');
var nownumber=parseInt($actel.html(),10);
if(nownumber==1){
return false;
}else{
pagination.gopage(selector,nownumber-1);
}
}
},
//向下翻頁
pagedown : function(){
var $a=$(this).find('a');
var selector=$a.attr('selector');
var _tempInstance=pagination._map[selector];
if(_tempInstance){
var pagenumber=_tempInstance.pagenumber;
//獲得該實例的分頁碼數(shù)
var $actel=$(selector+' li.active a');
var nownumber=parseInt($actel.html(),10);
if(nownumber==pagenumber){
return false;
}else{
pagination.gopage(selector,nownumber+1);
}
}
},
//前面頁面
previouspage : function(){
var selector=$(this).attr('selector');
var _tempInstance=pagination._map[selector];
if(_tempInstance){
var increment=_tempInstance.increment,
page=_tempInstance.page;
//判斷當前是第幾個，比如16，那么就以10的倍數(shù)向前翻頁
var $nowobj=$(selector+' a.previous').parent();
var nextnumber=parseInt($nowobj.next().children().html(),10);
var end=(nextnumber-1)%increment > 0 ? parseInt((nextnumber/increment),10)*increment : parseInt((nextnumber/increment-1),10)*increment;
pagination.gopage(selector, end+1);
}
},
//后面頁面
nextpage : function(){
//判斷當前點擊的哪些，比如：現(xiàn)在是5，點擊生成6...
var selector=$(this).attr('selector');
var _tempInstance=pagination._map[selector];
if(_tempInstance){
var increment=_tempInstance.increment;
var $nowobj=$(selector+' a.next').parent();
var prenumber=parseInt($nowobj.prev().children().html(),10);
if(parseInt(prenumber/5,10)==1){//說明在第一頁，要從5加載5個，直到結束
pagination.addPage(selector,$nowobj,5);
}else{
//第二次 增加頁面數(shù)量了，應該是從10開始了...
pagination.addPage(selector,$nowobj,increment);
}
}
},
addPage : function(selector,domobj,size){
var _tempInstance=pagination._map[selector];
if(_tempInstance){
var pagenumber=_tempInstance.pagenumber,
increment=_tempInstance.increment;
var start=parseInt(domobj.prev().children().html(),10);
pagination.gopage(selector, start+1);
}
},
loadPage : function(selector){
//根據(jù)selector獲得count,pagesize,page
var _tempInstance=pagination._map[selector];
if(!_tempInstance){
console.log('error : _tempInstance is null now ,check pagination params please!');
return null;
}
var count=_tempInstance.count,
pagesize=_tempInstance.pagesize,
page=_tempInstance.page,
increment=_tempInstance.increment,
pageArrayStr=pagination.pageArrayStr(selector,pagesize),
pagenumber=_tempInstance.pagenumber;
var $page=$(selector);
//清空內容
$page.html('');
var pageno=pagenumber;
page=page > pageno ? 1 : page; //如果當前頁碼樹大于總頁碼數(shù)則置為1，否則為當前頁碼數(shù)；
//如果頁數(shù)超過10，則增...,以5個數(shù)字遞增，
//顯示到page頁面的下一個5的倍數(shù)上。
var endpage=(parseInt(page/increment,10))*increment > pageno ? pageno : (parseInt(page/increment,10)+(page%increment==0 ? 0 : 1))*increment;
if(pageno<=increment){
endpage=pageno;
}
var pageHtml='';
if(pageArrayStr==''){
}else if(pagination._map[selector].pageArray.length==1){
pageHtml='<li class="pageinfo">共'+count+'條 </li>';
}else{
pageHtml='<li class="pageinfo">共'+count+'條 , 每頁'+pageArrayStr+'條</li>';
}
$page.append(pageHtml);
$page.append('<li class="prev pageup '+(page==1 ? 'disabled' : '')+'"><a title="'+pagination.previousTitle+'" href="javascript：;" selector="'+(selector)+'">'+pagination.previousContent+'</a></li>');
//判斷第幾頁
var start=0;
if(page > increment && page <=pageno){
$page.append('<li><a class="previous" href="javascript：;" selector="'+(selector)+'">...</a></li>');
//給一個自定義增長數(shù)量，比如5個，每次增長五個，當前頁面6頁面，增長5個為10個，start page為 6
start=parseInt((page%increment==0 ? (page-1) : page)/increment,10)*increment;
endpage=(start+increment ) > pageno ? pageno : (start+increment);//如果開始頁面加上增加頁面大于最大頁碼數(shù)，則等于最大頁碼數(shù)
if(endpage-page <increment){
start=endpage-increment;
}
}
for(var i=start;i<(endpage==0?1:endpage);i++){
var listr='<li class="unselect"><a href="javascript：;" selector="'+(selector)+'">'+(i+1)+'</a></li>';
//在第page頁面增加樣式
if((page-1)==i){
listr='<li class="active"><a selector="'+(selector)+'">'+(i+1)+'</a></li>';
}
$page.append(listr);
}
if(pageno > 5 && endpage !=pageno){
$page.append('<li><a class="next" href="javascript：;" selector="'+(selector)+'">...</a></li>');
}
$page.append('<li class="next pagedown '+(page==pageno ? 'disabled' : '')+'"><a title="'+pagination.nextTitle+'" href="javascript：;" selector="'+(selector)+'">'+pagination.nextContent+'</a></li>');
},
//跳轉頁面
gopage : function(selector,page){
var _tempInstance=pagination._map[selector];
if(_tempInstance){
_tempInstance.page=page;
_tempInstance.action=true;
_callback=_tempInstance.callback;
_pagesize=_tempInstance.pagesize;
pagination._map[selector]=_tempInstance;
_callback(pagination.transform({
page : page,
rows : _pagesize
}));
}
},
/*返回現(xiàn)在的頁面*/
getNowPage : function(selector){
selector=selector || (pagination.lastSelector || pagination._defaultSelector);//獲取上一個選擇器
var _tempInstance=pagination._map[selector];
if(_tempInstance){
_tempInstance.action=true;
var _page=_tempInstance.page,
_pagesize=_tempInstance.pagesize;
pagination._map[selector]=_tempInstance;
return pagination.transform({
page : _page,
rows : _pagesize
});
}
return null;
},
transform : function(paginationParams){
if(pagination.isTransform && pagination.isTransform==true){
var p=paginationParams.page || 1;
var rows=paginationParams.pagesize || 10;
return {
begin : (p-1)*rows+1,
end : p*rows
};
}
return paginationParams;
},
//返回分頁參數(shù)，以供列表頁面加載數(shù)據(jù)使用
getParams :function(selector){
selector=selector || (pagination.lastSelector || pagination._defaultSelector);//獲取上一個選擇器
var _tempInstance=pagination._map[selector];
if(_tempInstance){
var _pagesize=_tempInstance.pagesize;
return pagination.transform({
//第幾頁，一頁有多少條記錄
page:1,
rows : _pagesize
});
}
return null;
},
changePagesize : function(selector,ev){
var t=ev.currentTarget || ev.target || ev.srcElement,
$t=$(t),
v=$t.find('option:selected').val();
// selector=$t.attr('selector');
var _tempInstance=pagination._map[selector];
if(_tempInstance){
_tempInstance.pagesize=v;
var _callback=_tempInstance.callback;
pagination._map[selector]=_tempInstance;
//重新調用callback方法
_callback(pagination.transform({
page : 1,
rows : v
}));
}
}
};文章首發(fā)于 BUG集散地 ,https://chrunlee.cn/article/pagination-web-javascript.html
*請認真填寫需求信息，我們會在24小時內與您取得聯(lián)系。
