基于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获取form表单值的代码
Jul 17 Javascript
js 高效去除数组重复元素示例代码
Dec 19 Javascript
JQuery插件fancybox无法在弹出层使用左右键的解决办法
Dec 25 Javascript
javascript框架设计之框架分类及主要功能
Jun 23 Javascript
JavaScript实现简洁的俄罗斯方块完整实例
Mar 01 Javascript
微信小程序开发探究
Dec 27 Javascript
详解微信开发中snsapi_base和snsapi_userinfo及静默授权的实现
Mar 11 Javascript
详解基于vue-cli优化的webpack配置
Nov 06 Javascript
Vue.js实现分页查询功能
Nov 15 Javascript
JavaScript中import用法总结
Jan 20 Javascript
详解vuejs2.0 select 动态绑定下拉框支持多选
Apr 25 Javascript
JS实现利用闭包判断Dom元素和滚动条的方向示例
Aug 26 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
锁定年轻人的双倍活力 星巴克推出星倍醇即饮浓咖啡
2021/03/03 咖啡文化
PHP Session变量不能传送到下一页的解决方法
2009/11/27 PHP
APACHE的AcceptPathInfo指令使用介绍
2013/01/18 PHP
Laravel Memcached缓存驱动的配置与应用方法分析
2016/10/08 PHP
jquery 弹出登录窗口实现代码
2009/12/24 Javascript
百度Popup.js弹出框进化版 拖拽小框架发布 兼容IE6/7/8,Firefox,Chrome
2010/04/13 Javascript
javascript模拟实现ajax加载框实例
2014/10/15 Javascript
最简单的tab切换实例代码
2016/05/13 Javascript
Bootstrap模态框水平垂直居中与增加拖拽功能
2016/11/09 Javascript
jQuery Chosen通用初始化
2017/03/07 Javascript
浅谈对Angular中的生命周期钩子的理解
2017/07/31 Javascript
layer实现关闭弹出层刷新父界面功能详解
2017/11/15 Javascript
js根据json数据中的某一个属性来给数据分组的方法
2018/10/08 Javascript
vue-music 使用better-scroll遇到轮播图不能自动轮播问题
2018/12/03 Javascript
微信小程序使用map组件实现解析经纬度功能示例
2019/01/22 Javascript
这样回答继承可能面试官更满意
2019/12/10 Javascript
python实现ftp客户端示例分享
2014/02/17 Python
Python实现一个服务器监听多个客户端请求
2018/04/12 Python
对Python 窗体(tkinter)树状数据(Treeview)详解
2018/10/11 Python
pycharm修改文件的默认打开方式的步骤
2019/07/29 Python
Python一键查找iOS项目中未使用的图片、音频、视频资源
2019/08/12 Python
Python基础之字符串常见操作经典实例详解
2020/02/26 Python
Python安装并操作redis实现流程详解
2020/10/13 Python
微软英国官方网站:Microsoft英国
2016/10/15 全球购物
奥地利网上书店:Weltbild
2017/07/14 全球购物
会计师事务所审计实习自我鉴定
2013/09/20 职场文书
毕业生找工作的自我评价
2013/10/18 职场文书
生产部厂长职位说明书
2014/03/03 职场文书
2015元旦晚会主持词(开场白+结束语)
2014/12/14 职场文书
2015年社会治安综合治理工作总结
2015/04/10 职场文书
2015学校师德师风工作总结
2015/04/22 职场文书
岗位聘任协议书
2015/09/21 职场文书
公司开业的祝贺语大全(60条)
2019/07/05 职场文书
公司财务制度:成本管理控制制度模板
2019/11/19 职场文书
python基础之停用词过滤详解
2021/04/21 Python
Ruby处理YAML和json数据
2022/04/18 Ruby