> 웹 프론트엔드 > JS 튜토리얼 > jQuery_jquery를 기반으로 한 js 페이징 코드

jQuery_jquery를 기반으로 한 js 페이징 코드

WBOY
풀어 주다: 2016-05-16 18:25:19
원래의
1045명이 탐색했습니다.
复代码 代码如下:

function pagerBar(dataCount,pageSize,serverUrl,contentPlace,pagerbarPlace,callBack) {
this.dataCount = dataCount;
this.pageSize = 페이지 크기;
this.serverUrl = serverUrl;
this.contentPlace = $("#" contentPlace);
this.pagerbarPlace = $("#" pagerbarPlace);
this.callBack = 콜백;

this.pageCount = 0;
this.pageIndex = 1;
this.curInfo = $("");
this.prePage = $("");
this.nextPage = $("");
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 = $("").html("上一页").addClass("pageLink");
this.prePage.click(function(){
self.setLink(self.pageIndex-1);
});
this.nextPage = $("").html("下一页").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("暂时没有信息!");
}
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,
유형:"get",
data:{pageSize:self.pageSize,pageIndex:i},
cache:false,
error:function(){
alert("数据加载失败!");
},
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(); .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.pageCountthis.pageIndex = this.pageCount;
}
if(this.pageIndex>0){
this.setLink(this.pageIndex);
}
this.showBarInfo();
}
}

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿