基于jQuery的js分頁(yè)代碼
更新時(shí)間:2010年06月10日 23:51:07 作者:
jquery的分頁(yè)代碼,是結(jié)合數(shù)據(jù)庫(kù)實(shí)現(xiàn)的, 這里只給出核心jquery代碼。其它的大家可以發(fā)揮下。
復(fù)制代碼 代碼如下:
function pagerBar(dataCount,pageSize,serverUrl,contentPlace,pagerbarPlace,callBack){
this.dataCount = dataCount;
this.pageSize = pageSize;
this.serverUrl = serverUrl;
this.contentPlace = $("#"+contentPlace);
this.pagerbarPlace = $("#"+pagerbarPlace);
this.callBack = callBack;
this.pageCount = 0;
this.pageIndex = 1;
this.curInfo = $("<span/>");
this.prePage = $("<span/>");
this.nextPage = $("<span/>");
this.init();
}
pagerBar.prototype = {
init : function(){
this.getPageCount();
this.initLink();
this.showBarInfo();
if(this.pageCount>0){
this.setLink(1);
}
},
getPageCount : function(){
this.pageCount = parseInt(this.dataCount / this.pageSize);
if(this.dataCount % this.pageSize !=0){
this.pageCount++;
}
},
initLink : function(){
var self = this;
this.prePage = $("<span/>").html("上一頁(yè)").addClass("pageLink");
this.prePage.click(function(){
self.setLink(self.pageIndex-1);
});
this.nextPage = $("<span/>").html("下一頁(yè)").addClass("pageLink");
this.nextPage.click(function(){
self.setLink(self.pageIndex+1);
});
this.pagerbarPlace.append(this.curInfo).append(this.prePage).append(this.nextPage);
},
showBarInfo : function(){
this.prePage.hide();
this.nextPage.hide();
if(this.pageCount==0){
this.curInfo.html("暫時(shí)沒(méi)有信息!");
}
else if(this.pageCount==1){
this.curInfo.html("1/1");
}
else{
this.curInfo.html(this.pageCount + "/" + this.pageIndex);
}
},
setLink : function(i){
var self = this;
$.ajax({
url:self.serverUrl,
type:"get",
data:{pageSize:self.pageSize,pageIndex:i},
cache:false,
error:function(){
alert("數(shù)據(jù)加載失敗!");
},
success:function(htmlData){
self.contentPlace.html(htmlData);
if(self.pageCount==1){
self.prePage.hide();
self.nextPage.hide();
}else{
if(i==1){
self.prePage.hide();
self.nextPage.show();
}else if(i==self.pageCount){
self.prePage.show();
self.nextPage.hide();
}else{
self.prePage.show();
self.nextPage.show();
}
}
self.pageIndex = i;
self.curInfo.html(self.pageCount+"/"+self.pageIndex);
if(self.callBack){
self.callBack();
}
}
});
},
changeServerUrl : function(dataCount,serverUrl){
this.dataCount = dataCount;
this.serverUrl = serverUrl;
this.pageIndex=1;
this.getPageCount();
this.showBarInfo();
this.contentPlace.html("");
if(this.pageCount>0){
this.setLink(1);
}
},
dataCountDec : function(){
this.dataCount--;
this.getPageCount();
if(this.pageCount<this.pageIndex){
this.pageIndex = this.pageCount;
}
if(this.pageIndex>0){
this.setLink(this.pageIndex);
}
this.showBarInfo();
}
}
您可能感興趣的文章:
- 非常不錯(cuò)的一個(gè)JS分頁(yè)效果代碼,值得研究
- 純js分頁(yè)代碼(簡(jiǎn)潔實(shí)用)
- js分頁(yè)顯示div的內(nèi)容
- 利用js制作html table分頁(yè)示例(js實(shí)現(xiàn)分頁(yè))
- 純javascript實(shí)現(xiàn)分頁(yè)(兩種方法)
- js表格分頁(yè)實(shí)現(xiàn)代碼
- JS+Ajax+Jquery實(shí)現(xiàn)頁(yè)面無(wú)刷新分頁(yè)以及分組 超強(qiáng)的實(shí)現(xiàn)
- JS分頁(yè)控件 可用于無(wú)刷新分頁(yè)
- 新聞內(nèi)頁(yè)-JS分頁(yè)
- js css自定義分頁(yè)效果
相關(guān)文章
jQuery基礎(chǔ)的工廠函數(shù)以及定時(shí)器的經(jīng)典實(shí)例分析
下面小編就為大家?guī)?lái)一篇jQuery基礎(chǔ)的工廠函數(shù)以及定時(shí)器的經(jīng)典實(shí)例分析。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在2016-05-05jquery實(shí)現(xiàn)簡(jiǎn)單下拉菜單效果
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)簡(jiǎn)單下拉菜單效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04jquery DataTable實(shí)現(xiàn)前后臺(tái)動(dòng)態(tài)分頁(yè)
本篇文章主要介紹了jquery DataTable實(shí)現(xiàn)前后臺(tái)動(dòng)態(tài)分頁(yè)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-06-06jQuery3.0中的buildFragment私有函數(shù)詳解
在 jQuery3.0中,buildFragment 是一個(gè)私有函數(shù),用來(lái)構(gòu)建一個(gè)包含子節(jié)點(diǎn) fragment 對(duì)象。下文給大家介紹jQuery3.0中的buildFragment私有函數(shù)詳解,對(duì)jquery3.0 buildfragment相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2016-08-08使用JQuery自動(dòng)完成插件Auto Complete詳解
這篇文章主要介紹了使用JQuery自動(dòng)完成插件Auto Complete詳解,使用JQuery自動(dòng)完成插件,更新現(xiàn)有圖書(shū)列表頁(yè)面上的搜索,當(dāng)用戶(hù)鍵入的時(shí)候立即顯示結(jié)果。,需要的朋友可以參考下2019-06-06jquery插件lazyload.js延遲加載圖片的使用方法
lazyload.js是一個(gè)基于JQuery的插件,可以用來(lái)緩沖加載圖片。下面介紹這個(gè)插件的使用方法2014-02-02jQuery實(shí)現(xiàn)帶有洗牌效果的動(dòng)畫(huà)分頁(yè)實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)帶有洗牌效果的動(dòng)畫(huà)分頁(yè),涉及jquery頁(yè)面元素樣式及animate方法的相關(guān)使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08