作家
登录

基于jQuery的js分页代码

作者: 来源:www.28hudong.com 2013-03-30 01:31:41 阅读 我要评论

复制代码 代码如下: 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("上一页").addClass("pageLink"); this.prePage.click(function(){ self.setLink(self.pageIndex-1); }); this.nextPage = $("<span/>").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, type:"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(); } } 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(); } }

  推荐阅读

  Extjs中常用表单介绍与应用

目标: 知道表单面板如何创建 了解表单面板中xtype的类型的应用 知道表单面板如何验证,绑定,取值 综合应用表单面板(玩转它) 内容: 首先我们要理解的是FormPanel也是继承panel组件的。所以它有着panel的属性 要创>>>详细阅读


本文标题:基于jQuery的js分页代码

地址:http://www.17bianji.com/kaifa2/JS/26229.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)