基于jQuery的js分页代码


Posted in Javascript onJune 10, 2010
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(); 
} 
}
Javascript 相关文章推荐
jQuery对象和DOM对象的相互转化实现代码
Mar 02 Javascript
子窗体与父窗体传值示例js代码
Aug 01 Javascript
jquery三个关闭弹出层的小示例
Nov 05 Javascript
Egret引擎开发指南之创建项目
Sep 03 Javascript
JavaScript实现找出字符串中第一个不重复的字符
Sep 03 Javascript
javascript简单实现跟随滚动条漂浮的返回顶部按钮效果
Aug 19 Javascript
Vue.js组件tab实现选项卡切换
Mar 23 Javascript
深入理解Vue transition源码分析
Jul 30 Javascript
Vue.js组件间的循环引用方法示例
Dec 27 Javascript
微信小程序实现城市列表选择
Jun 05 Javascript
Three.js实现3D机房效果
Dec 30 Javascript
Node.js assert断言原理与用法分析
Jan 04 Javascript
基于jQuery的弹出警告对话框美化插件(警告,确认和提示)
Jun 10 #Javascript
jQuery EasyUI中对表格进行编辑的实现代码
Jun 10 #Javascript
jQuery创建自己的插件(自定义插件)的方法
Jun 10 #Javascript
jQuery-ui中自动完成实现方法
Jun 10 #Javascript
Array.prototype.slice 使用扩展
Jun 09 #Javascript
Confirmer JQuery确认对话框组件
Jun 09 #Javascript
Jquery CheckBox全选方法代码附js checkbox全选反选代码
Jun 09 #Javascript
You might like
基于PHP的cURL快速入门教程 (小偷采集程序)
2011/06/02 PHP
php中操作memcached缓存进行增删改查数据的实现代码
2014/08/15 PHP
CI框架扩展系统核心类的方法分析
2016/05/23 PHP
PHP 根据key 给二维数组分组
2016/12/09 PHP
js树形控件脚本代码
2008/07/24 Javascript
用JS操作FRAME中的IFRAME及其内容的实现代码
2008/07/26 Javascript
JavaScript高级程序设计 扩展--关于动态原型
2010/11/09 Javascript
小试JQuery的AutoComplete插件
2011/05/04 Javascript
jQuery层次选择器选择元素使用介绍
2013/04/18 Javascript
jQuery手机浏览器中拖拽动作的艰难性分析
2015/02/04 Javascript
JS 根据子网掩码,网关计算出所有IP地址范围示例
2020/04/23 Javascript
如何利用模板将HTML从JavaScript中抽离
2016/10/08 Javascript
禁用backspace网页回退功能的实现代码
2016/11/15 Javascript
浅谈JS对html标签的属性的干预以及对CSS样式表属性的干预
2017/06/25 Javascript
Node解决简单重复问题系列之Excel内容的获取
2018/01/02 Javascript
JS实现模糊查询带下拉匹配效果
2018/06/21 Javascript
如何在JavaScript中谨慎使用代码注释
2019/06/21 Javascript
d3.js实现图形拖拽
2019/12/19 Javascript
详解vue beforeEach 死循环问题解决方法
2020/02/25 Javascript
JavaScript中继承原理与用法实例入门
2020/05/09 Javascript
Python内置函数之filter map reduce介绍
2014/11/30 Python
3分钟学会一个Python小技巧
2018/11/23 Python
django创建最简单HTML页面跳转方法
2019/08/16 Python
TensorFlow中如何确定张量的形状实例
2020/06/23 Python
python中关于数据类型的学习笔记
2020/07/19 Python
Python爬虫之爬取淘女郎照片示例详解
2020/07/28 Python
美国在线精品家居网站:Burke Decor
2017/04/12 全球购物
H&M旗下高端女装品牌:& Other Stories
2018/05/07 全球购物
最好的商品表达自己:Cafepress
2019/09/04 全球购物
亚洲颇具影响力的男性在线购物零售商:His
2019/11/24 全球购物
俄罗斯皮肤健康中心:Pharmacosmetica.ru
2020/02/22 全球购物
Python如何实现单例模式
2016/06/03 面试题
工作自我评价分享
2013/12/01 职场文书
《诺贝尔》教学反思
2014/02/17 职场文书
沙滩主题婚礼活动策划方案
2014/09/15 职场文书
护士自荐信范文(2016推荐篇)
2016/01/28 职场文书