基于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 相关文章推荐
表单元素与非表单元素刷新区别详细解析
Nov 06 Javascript
Node.js实现批量去除BOM文件头
Dec 20 Javascript
举例讲解JavaScript中将数组元素转换为字符串的方法
Oct 25 Javascript
学习JavaScript正则表达式
Nov 13 Javascript
理解JavaScript事件对象
Jan 25 Javascript
JS实现数组去重复值的方法示例
Feb 18 Javascript
js实现点击展开隐藏效果(实例代码)
Sep 28 Javascript
jquery无缝图片轮播组件封装
Nov 25 jQuery
移动端 Vue+Vant 的Uploader 实现上传、压缩、旋转图片功能
Jun 10 Javascript
微信小程序基础教程之worker线程的使用方法
Jul 15 Javascript
layer ui 导入文件之前传入数据的实例
Sep 23 Javascript
Vue vee-validate插件的简单使用
Jun 22 Vue.js
基于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 不同编码下的字符串长度区分
2009/09/26 PHP
注册页面之前先验证用户名是否存在的php代码
2012/07/14 PHP
php采集内容中带有图片地址的远程图片并保存的方法
2015/01/03 PHP
PHP+shell实现多线程的方法
2015/07/01 PHP
部署PHP时的4个配置修改说明
2015/10/19 PHP
yii2.0数据库迁移教程【多个数据库同时同步数据】
2016/10/08 PHP
Laravel 在views中加载公共页面的实现代码
2019/10/22 PHP
javascript英文日期(有时间)选择器
2007/05/02 Javascript
jQuery简单实现banner图片切换
2014/01/02 Javascript
Javascript常用小技巧汇总
2015/06/24 Javascript
WEB前端开发框架Bootstrap3 VS Foundation5
2016/05/16 Javascript
jQuery实现可拖拽的许愿墙效果【附demo源码下载】
2016/09/14 Javascript
Vue.js路由组件vue-router使用方法详解
2016/12/02 Javascript
JS高级运动实例分析
2016/12/20 Javascript
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
2017/04/13 Javascript
提高Node.js性能的应用技巧分享
2017/08/10 Javascript
简述JS浏览器的三种弹窗
2018/07/15 Javascript
微信小程序配置服务器提示验证token失败的解决方法
2019/04/03 Javascript
JavaScript 中的无穷数(Infinity)详解
2020/02/13 Javascript
打印出python 当前全局变量和入口参数的所有属性
2009/07/01 Python
使用PyInstaller将python转成可执行文件exe笔记
2018/05/26 Python
Python实现E-Mail收集插件实例教程
2019/02/06 Python
python生成器用法实例详解
2019/11/22 Python
娇韵诗法国官网:Clarins法国
2019/01/29 全球购物
保加利亚手表、香水、化妆品和珠宝购物网站:Brasty.bg
2020/04/22 全球购物
全球最大运动品牌的男装、女装和童装官方库存商:A&A Sports
2021/01/17 全球购物
监理员的岗位职责
2013/11/13 职场文书
应届毕业生求职信范文分享
2013/12/26 职场文书
公证委托书大全
2014/04/04 职场文书
模具设计与制造专业自荐书
2014/07/01 职场文书
2015年世界卫生日活动总结
2015/02/09 职场文书
迎新年主持词
2015/07/06 职场文书
Golang二维切片初始化的实现
2021/04/08 Golang
JavaScript实现两个数组的交集
2022/03/25 Javascript
Golang入门之计时器
2022/05/04 Golang
Li list-style-image 图片垂直居中实现方法
2023/05/21 HTML / CSS