jQuery Pagination分页插件_动力节点Java学院整理


Posted in jQuery onJuly 17, 2017

插件简介

此jQuery插件为Ajax分页插件,一次性加载,故分页切换时无刷新与延迟,如果数据量较大不建议用此方法,因为加载会比较慢。

原插件CSS不太合理,使用浮动,故无法方便实现左右方向的定位,且未清除浮动,在中文修改版中我对其进行了优化,使其支持text-align的定位。

使用方法

跟一般的jQuery插件一样,此插件使用也很简单便捷。方法是pagination,例如$("#page").pagination(100);

参数

参数名 描述 参数值
maxentries 总条目数 必选参数,整数
items_per_page 每页显示的条目数 可选参数,默认是10
num_display_entries 连续分页主体部分显示的分页条目数 可选参数,默认是10
current_page 当前选中的页面 可选参数,默认是0,表示第1页
num_edge_entries 两侧显示的首尾分页的条目数 可选参数,默认是0
link_to 分页的链接 字符串,可选参数,默认是"#"
prev_text “前一页”分页按钮上显示的文字 字符串参数,可选,默认是"Prev"
next_text “下一页”分页按钮上显示的文字 字符串参数,可选,默认是"Next"
ellipse_text 省略的页数用什么文字表示 可选字符串参数,默认是"..."
prev_show_always 是否显示“前一页”分页按钮 布尔型,可选参数,默认为true,即显示“前一页”按钮
next_show_always 是否显示“下一页”分页按钮 布尔型,可选参数,默认为true,即显示“下一页”按钮
callback 回调函数 默认无执行效果

举例

例如下面的使用代码:

$("#Pagination").pagination(56, {
  num_edge_entries: 2,
  num_display_entries: 4,
  callback: pageselectCallback,
  items_per_page:1
});

这段代码表示的含义是:总共有56(maxentries)个列表项,首尾两侧分页显示2(num_edge_entries)个,连续分页主体数目显示4(num_display_entries)个,回调函数为pageselectCallback(callback),每页显示的列表项为1(items_per_page)个。

jQuery 相关文章推荐
jquery插件制作 自增长输入框实现代码
Aug 17 jQuery
jQuery日程管理控件glDatePicker用法详解
Mar 29 jQuery
jquery 禁止鼠标右键并监听右键事件
Apr 27 jQuery
jQuery操作css样式
May 15 jQuery
jQuery用户头像裁剪插件cropbox.js使用详解
Jun 07 jQuery
利用jquery去掉时光轴头尾部线条的方法实例
Jun 16 jQuery
jQuery+Ajax请求本地数据加载商品列表页并跳转详情页的实现方法
Jul 12 jQuery
jQuery中 DOM节点操作方法大全
Oct 12 jQuery
jquery获取transform里的值实现方法
Dec 12 jQuery
JQuery获得内容和属性方法解析
May 30 jQuery
jQuery实现简单QQ聊天框
Aug 27 jQuery
使用jQuery实现购物车
Oct 29 jQuery
jQuery Form插件使用详解_动力节点Java学院整理
Jul 17 #jQuery
jQuery列表检索功能实现代码
Jul 17 #jQuery
如何将 jQuery 从你的 Bootstrap 项目中移除(取而代之使用Vue.js)
Jul 17 #jQuery
用户管理的设计_jquery的ajax实现二级联动效果
Jul 13 #jQuery
JQuery EasyUI的一些常用组件
Jul 12 #jQuery
jQuery+Ajax请求本地数据加载商品列表页并跳转详情页的实现方法
Jul 12 #jQuery
jQuery 循环遍历改变a标签的href(实例讲解)
Jul 12 #jQuery
You might like
php 接口类与抽象类的实际作用
2009/11/26 PHP
使用php+swoole对client数据实时更新(一)
2016/01/07 PHP
JS动画效果代码3
2008/04/03 Javascript
jQuery 剧场版 你必须知道的javascript
2009/05/27 Javascript
javascript 当前日期转化为中文的实现代码
2010/05/13 Javascript
元素的内联事件处理函数的特殊作用域在各浏览器中存在差异
2011/01/12 Javascript
JavaScript 用Node.js写Shell脚本[译]
2012/09/20 Javascript
js将iframe中控件的值传到主页面控件中的实现方法
2013/03/11 Javascript
利用jQuery设计一个简单的web音乐播放器的实例分享
2016/03/08 Javascript
真正好用的js验证上传文件大小的简单方法
2016/10/27 Javascript
Angularjs2不同组件间的通信实例代码
2017/05/06 Javascript
ECMAScript6变量的解构赋值实例详解
2017/09/19 Javascript
webuploader分片上传的实现代码(前后端分离)
2018/09/10 Javascript
python 文件和路径操作函数小结
2009/11/23 Python
Python素数检测的方法
2015/05/11 Python
使用Python编写Prometheus监控的方法
2018/10/15 Python
Python实现一个带权无回置随机抽选函数的方法
2019/07/24 Python
解决Mac下使用python的坑
2019/08/13 Python
基于Python实现扑克牌面试题
2019/12/11 Python
通过Python实现一个简单的html页面
2020/05/16 Python
Python docutils文档编译过程方法解析
2020/06/23 Python
python 如何快速复制序列
2020/09/07 Python
15个Pythonic的代码示例(值得收藏)
2020/10/29 Python
CSS3过渡transition效果实例介绍
2016/05/03 HTML / CSS
路易威登和香奈儿手袋:LuxeDH
2017/01/12 全球购物
如何进行有效的自我评价
2013/09/27 职场文书
幼儿园大班新学期寄语
2014/01/18 职场文书
计算机网络专业自荐书
2014/06/09 职场文书
初三毕业感言
2015/07/31 职场文书
公司出差管理制度范本
2015/08/05 职场文书
宾馆安全管理制度
2015/08/06 职场文书
2019数学教师下学期工作总结
2019/06/27 职场文书
护理专业毕业自我鉴定
2019/08/12 职场文书
Python操作CSV格式文件的方法大全
2021/07/15 Python
动画电影《擅长捉弄人的高木同学》6月10日上映!
2022/03/20 日漫
Python如何将list中的string转换为int
2022/07/15 Ruby