JavaScript EasyPager 分页函数


Posted in Javascript onMay 25, 2011
var EasyPager = function(wrap,pageCount,currPage){ 
var d = document 
,el = function(tag,inner,click,css){ 
tag = d.createElement(tag); 
inner && (tag.innerHTML = inner); 
click && (tag.onclick = click); 
css && (tag.className=css); 
return tag; 
} 
,append = function(parent,children,child){ 
children = [].concat(children); 
for(var i=0,j=children.length;i<j;i++){ 
child = children[i]; 
child && parent.appendChild(child); 
} 
return parent; 
} 
,easyFn = function(n){return function(){EasyPager(wrap,pageCount,n)}} 
,box = el("div"),firstPage,prevPage,lastPage,nextPage,startNum,endNum,pages= []; currPage!=1 && (firstPage = el("span","<<",easyFn(1)),prevPage = el("span","<",easyFn(currPage-1))); 
currPage!=pageCount && (lastPage = el("span",">>",easyFn(pageCount)),nextPage = el("span",">",easyFn(currPage+1))); 
(pageCount<=10) ? (startNum=1,endNum=pageCount) : (startNum=currPage-4,endNum = currPage+5,(currPage<=5) && (startNum=1,endNum=10),(currPage>=pageCount-5)&&(endNum=pageCount,startNum=pageCount-10+1)); 
for(var i=startNum;i<=endNum;i++)pages.push(el("span",i,easyFn(i),i==currPage?"currSpan":null)) 
append((wrap.innerHTML="",wrap),append(box,[firstPage,prevPage].concat(pages).concat(nextPage,lastPage))); 
};
Javascript 相关文章推荐
javascript removeChild 使用注意事项
Apr 11 Javascript
判断一个变量是数组Array类型的方法
Sep 16 Javascript
Jquery实现纵向横向菜单
Jan 24 Javascript
Javascript设计模式之观察者模式(推荐)
Mar 29 Javascript
有关文件上传 非ajax提交 得到后台数据问题
Oct 12 Javascript
vue的安装及element组件的安装方法
Mar 09 Javascript
jQuery实现通过方向键控制div块上下左右移动的方法【测试可用】
Apr 26 jQuery
详解vue文件中使用echarts.js的两种方式
Oct 18 Javascript
Vue 实现分页与输入框关键字筛选功能
Jan 02 Javascript
JS实现简易留言板增删功能
Feb 08 Javascript
JS实现小米轮播图
Sep 21 Javascript
js制作提示框插件
Dec 24 Javascript
浅说js变量
May 25 #Javascript
潜说js对象和数组
May 25 #Javascript
一些常用的JavaScript函数(json)附详细说明
May 25 #Javascript
javascript中万恶的function实例分析
May 25 #Javascript
js 页面关闭前的出现提示的实现代码
May 25 #Javascript
仅IE不支持setTimeout/setInterval函数的第三个以上参数
May 25 #Javascript
IE6/7/8/9不支持exec的简写方式
May 25 #Javascript
You might like
PHP导出Excel实例讲解
2016/01/24 PHP
ThinkPHP框架整合微信支付之刷卡模式图文详解
2019/04/10 PHP
Jquery知识点三 jquery表单对象操作
2011/01/17 Javascript
js 数据类型转换总结笔记
2011/01/17 Javascript
js内存泄露的几种情况详细探讨
2013/05/31 Javascript
jQuery点击弹出下拉菜单的小例子
2013/08/01 Javascript
Jquery 模拟用户点击超链接或者按钮的方法
2013/10/25 Javascript
JavaScript中的对象序列化介绍
2014/12/30 Javascript
JS中prototype的用法实例分析
2015/03/19 Javascript
javascript正则表达式之分组概念与用法实例
2016/06/16 Javascript
jQuery插件dataTables添加序号列的方法
2016/07/06 Javascript
jQuery如何防止Ajax重复提交
2016/10/14 Javascript
关于foreach循环中遇到的问题小结
2017/05/08 Javascript
vue2.0 与 bootstrap datetimepicker的结合使用实例
2017/05/22 Javascript
Node.js自定义实现文件路由功能
2017/09/22 Javascript
js操作二进制数据方法
2018/03/03 Javascript
Vue实现一个图片懒加载插件
2019/03/11 Javascript
在vue和element-ui的table中实现分页复选功能
2019/12/04 Javascript
[43:24]VG vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
pip 错误unused-command-line-argument-hard-error-in-future解决办法
2014/06/01 Python
Python中的字典与成员运算符初步探究
2015/10/13 Python
简述Python2与Python3的不同点
2018/01/21 Python
python使用正则表达式来获取文件名的前缀方法
2018/10/21 Python
Python 项目转化为so文件实例
2019/12/23 Python
浅谈python 中的 type(), dtype(), astype()的区别
2020/04/09 Python
北欧最好的童装网上商店:Babyshop
2019/09/15 全球购物
澳大利亚在线床零售商:Bedworks
2020/09/01 全球购物
某IT外企面试题-二分法求方程!看看大家的C++功底
2015/07/04 面试题
高中三年学习生活的自我评价
2013/10/10 职场文书
失业者真诚求职信范文
2013/12/25 职场文书
2014年社区庆元旦活动方案
2014/03/08 职场文书
法人身份证明书
2015/06/18 职场文书
2019学校运动会开幕词
2019/05/13 职场文书
处理canvas绘制图片模糊问题
2022/05/11 Javascript
ubuntu如何搭建vsftpd服务器
2022/12/24 Servers