kkpager的用法網上有不少,能夠百度的到。javascript
可是在調用動態數據的時候發現兩個問題html
1.Ajax數據變化可是頁碼不變的問題,方法來自網上java
2.按查詢條件從新生成數據和分頁,點擊分頁事件後totalpage 和totalrecord 和沒加條件查詢的數據同樣。ajax
主要緣由是由於客戶端不會幫你保留總頁碼數和總條數,json
在使用kkpager插件的頁面,放兩個hidden標籤。this
而後在按查詢條件從新生成數據時,用hidden按鈕綁定你的總頁數和總條數。url
下面是ajax 調用後臺數據,把返回的總頁數和總條數存放在hidden。spa
$.ajax({ type: "get", dataType: "json", url: urlStr2, success: totalOnsuccess }); //根據返回的total 加載數據和分頁 function totalOnsuccess(data) { var resInfoArray = eval(data); totalRecords = resInfoArray[0].TOTAL; totalPage = Math.ceil(totalRecords / pageSize); //向上取整 $("#totalpages").val(totalPage); //綁定獲取的總頁數 $("#totalRecords").val(totalRecords);//綁定獲取的總條數 if (!pageNo) { pageNo = 1; } if (totalRecords > 0) { FkeepPage(pageNo, totalPage, totalRecords); //調用分頁插件 } else { $("#kkpager").html("<div style='text-align:center'>沒有符合條件的數據</div>") } queryInfoTable(tablename, pageSize, pageNo, where); //加載表格數據 }
/* pageNo:當前頁 totalPage:總頁數 totalRecords:總條數 */ function FkeepPage(pageNo, totalPage, totalRecords) { //生成分頁 //有些參數是可選的,好比lang,若不傳有默認值 kkpager.generPageHtml({ pno: pageNo, //總頁碼 total: totalPage, //總數據條數 totalRecords: totalRecords, mode: 'click',//默認值是link,可選link或者click click: function (n) { // do something // this.selectPage(n); //默認的,由於不能符合個人要求改爲下面的
this.selectPage(n, $("#totalpages").val(), $("#totalRecords").val());
queryInfoTable(tablename, pageSize, n, where); //加載表格數據 return false; } /* ,lang : { firstPageText : '首頁', firstPageTipText : '首頁', lastPageText : '尾頁', lastPageTipText : '尾頁', prePageText : '上一頁', prePageTipText : '上一頁', nextPageText : '下一頁', nextPageTipText : '下一頁', totalPageBeforeText : '共', totalPageAfterText : '頁', currPageBeforeText : '當前第', currPageAfterText : '頁', totalInfoSplitStr : '/', totalRecordsBeforeText : '共', totalRecordsAfterText : '條數據', gopageBeforeText : ' 轉到', gopageButtonOkText : '肯定', gopageAfterText : '頁', buttonTipBeforeText : '第', buttonTipAfterText : '頁' }*/ },true);//加true 默認沒有,由於頁碼數不更新,因此加上了 }
後面的是修改kkpager.js 插件
主要就是把裏面的code
//不刷新頁面直接手動調用選中某一頁碼 selectPage: function (n) { this.generPageHtml(this._config,true); },
改爲
//不刷新頁面直接手動調用選中某一頁碼 selectPage: function (n, b, c) { this._config['pno'] = n; this._config['total'] = b; this._config['totalRecords'] = c; this.generPageHtml(this._config,true); },