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 相关文章推荐
js 操作符实例代码
Oct 24 Javascript
javascript定义函数的方法
Dec 06 Javascript
JQuery入门——用映射方式绑定不同事件应用示例
Feb 05 Javascript
浅析js中2个等号与3个等号的区别
Aug 06 Javascript
jQuery 浮动导航菜单适合购物商品类型的网站
Sep 09 Javascript
JQuery实现左右滚动菜单特效
Sep 28 Javascript
jQuery获取父元素节点、子元素节点及兄弟元素节点的方法
Apr 14 Javascript
Bootstrap表单布局样式源代码
Jul 04 Javascript
JavaScript实现购物车基本功能
Jul 21 Javascript
关于jQuery里prev()的简单操作代码
Oct 27 jQuery
Vue2.0设置全局样式(less/sass和css)
Nov 18 Javascript
VUE Error: getaddrinfo ENOTFOUND localhost
May 03 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使用memcache存储session的详解
2013/06/25 PHP
PHP数字和字符串ID互转函数(类似优酷ID)
2014/06/30 PHP
javascript 表单的友好用户体现
2009/01/07 Javascript
JavaScript实现动态增加文件域表单
2009/02/12 Javascript
获得所有表单值的JQuery实现代码[IE暂不支持]
2012/05/24 Javascript
如何使用jquery控制CSS样式,并且取消Css样式(如背景色,有实例)
2013/07/09 Javascript
jquery手风琴特效插件
2015/02/04 Javascript
使用JavaScript开发IE浏览器本地插件实例
2015/02/18 Javascript
jquery简单实现外部链接用新窗口打开的方法
2015/05/30 Javascript
Bootstrap每天必学之标签与徽章
2015/11/27 Javascript
javascript获取网页各种高宽及位置的方法总结
2016/07/27 Javascript
JavaScript随机打乱数组顺序之随机洗牌算法
2016/08/02 Javascript
利用Node.JS实现邮件发送功能
2016/10/21 Javascript
jquery实现轮播图效果
2017/02/13 Javascript
jQuery实现扑克正反面翻牌效果
2017/03/10 Javascript
JS实现简单抖动效果
2017/06/01 Javascript
vue-resource调用promise取数据方式详解
2017/07/21 Javascript
[15:15]教你分分钟做大人:狙击手
2014/10/30 DOTA
[01:57]DOTA2上海特锦赛小组赛解说单车采访花絮
2016/02/27 DOTA
使用python编写android截屏脚本双击运行即可
2014/07/21 Python
python里大整数相乘相关技巧指南
2014/09/12 Python
手动实现把python项目发布为exe可执行程序过程分享
2014/10/23 Python
Python中利用sqrt()方法进行平方根计算的教程
2015/05/15 Python
python中enumerate函数遍历元素用法分析
2016/03/11 Python
深入理解Python中的super()方法
2017/11/20 Python
Python实现最常见加密方式详解
2019/07/13 Python
Python for i in range ()用法详解
2020/09/18 Python
Python 的 __str__ 和 __repr__ 方法对比
2020/09/02 Python
基础的CSS3弹性盒Flexbox布局使用实例
2016/04/08 HTML / CSS
webView加载html图片遇到的问题解决
2019/10/08 HTML / CSS
加拿大女装网上购物:Reitmans
2016/10/20 全球购物
2019年Java 最常见的 面试题
2016/10/19 面试题
品学兼优的大学生自我评价
2013/09/20 职场文书
离婚起诉状范本
2015/05/19 职场文书
Django使用echarts进行可视化展示的实践
2021/06/10 Python
一篇文章带你学习Mybatis-Plus(新手入门)
2021/08/02 Java/Android