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 给汉字排序实例代码
Jun 28 Javascript
用JQuery 实现AJAX加载XML并解析的脚本
Jul 25 Javascript
jquery入门必备的基本认识及实例(整理)
Jun 24 Javascript
checkbox使用示例
Aug 23 Javascript
将list转换为json失败的原因
Dec 17 Javascript
js判断出两个字符串最大子串的函数实现方法
Nov 01 Javascript
详解js的事件代理(委托)
Dec 22 Javascript
svg动画之动态描边效果
Feb 22 Javascript
最实用的JS数组函数整理
Dec 05 Javascript
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题
Sep 12 Javascript
微信小程序基于movable-view实现滑动删除效果
Jan 08 Javascript
Ajax 的初步实现(使用vscode+node.js+express框架)
Jun 18 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添加数据到xml文件的简单例子
2016/09/08 PHP
javascript function调用时的参数检测常用办法
2010/02/26 Javascript
Firefox下提示illegal character并出现乱码的原因
2010/03/25 Javascript
JavaScript 判断浏览器是否支持SVG的代码
2013/03/21 Javascript
js实现按一下删除键删除整个单词附demo
2014/09/05 Javascript
js实现跨域的几种方法汇总(图片ping、JSONP和CORS)
2015/10/25 Javascript
原生JS和jQuery版实现文件上传功能
2016/04/18 Javascript
Immutable 在 JavaScript 中的应用
2016/05/02 Javascript
JavaScript代码里的判断小结
2016/08/22 Javascript
Bootstrap 下拉多选框插件Bootstrap Multiselect
2017/01/22 Javascript
基于JS实现bookstore静态页面的实例代码
2017/02/22 Javascript
vue2.0 自定义 饼状图 (Echarts)组件的方法
2018/03/02 Javascript
详解webpack引入第三方库的方式以及注意事项
2019/01/15 Javascript
使用vue脚手架(vue-cli)搭建一个项目详解
2019/05/09 Javascript
vue iview多张图片大图预览、缩放翻转
2019/07/13 Javascript
js设计模式之代理模式及订阅发布模式实例详解
2019/08/15 Javascript
利用JavaScript为句子加标题的3种方法示例
2021/01/05 Javascript
vue使用过滤器格式化日期
2021/01/20 Vue.js
[01:05:52]DOTA2-DPC中国联赛 正赛 Ehome vs Aster BO3 第一场 2月2日
2021/03/11 DOTA
机器学习10大经典算法详解
2017/12/07 Python
详解mac python+selenium+Chrome 简单案例
2019/11/08 Python
python打包多类型文件的操作方法
2020/09/21 Python
用python写一个带有gui界面的密码生成器
2020/11/06 Python
美国职棒大联盟官方网上商店:MLBShop.com
2017/11/12 全球购物
英国PC组件和在线电脑商店:SCAN
2019/04/18 全球购物
七年级历史教学反思
2014/02/05 职场文书
信息管理应届生求职信
2014/03/07 职场文书
本科毕业自我鉴定
2014/03/20 职场文书
电子商务专业应届生求职信
2014/05/28 职场文书
假期安全教育广播稿
2014/10/04 职场文书
党的群众路线教育实践活动批评与自我批评发言稿
2014/10/16 职场文书
医院科室评语
2015/01/04 职场文书
英语演讲开场白
2015/05/29 职场文书
创业计划之特色精品店
2019/08/12 职场文书
详解RedisTemplate下Redis分布式锁引发的系列问题
2021/04/27 Redis
Java实现注册登录跳转
2022/06/16 Java/Android