jQuery插件pagination实现分页特效


Posted in Javascript onApril 12, 2015

实用jQuery分页特效插件jquery.pagination.js,基于jQuery实现,可根据pageselectCallback函数callback调用通过ajax调用动态数据,目前的方法是生成JSON数据到JS文件,调用的数据是JSON格式数据,缺点是数据是一次性读出来的,效率会差些,插件支持众多参数的自定义配置功能,还是很不错的,大家可以根据自己的想法进行改进。

jQuery插件pagination实现分页特效

使用方法:

1.加载插件和jQuery

<link rel="stylesheet" href="pagination.css"> 
<script type="text/javascript" src="jquery.min.js"></script> 
<script type="text/javascript" src="jquery.pagination.js"></script>

2.HTML内容

<div class="pagination"></div>

3.函数调用

<script type="text/javascript"> 
function pageselectCallback(page_index, jq){ 
        alert(page_index); 
        return false; 
      } 
$(document).ready(function(){ 
$(".pagination").pagination(100, { 
  callback: pageselectCallback, 
  
   num_edge_entries: 1, 
  
  }); 
}); 
</script>

参数配置解释

参数名 参数说明 可选值 默认值

callback 点击分页按钮的回调函数 函数 function(){return false;}
current_page 初始化时选中的页码 数字 0
items_per_page 每页每页显示的记录条数 数字 10
link_to 分页链接 字符串 #
num_display_entries 最多显示的页码数 数字 11
next_text ‘下一页'显示的文字 字符串 Next
next_show_always 如果设置为false‘下一页'按钮只有在还能增加页码的情况下才显示 布尔值 true
prev_show_always 如果设置为false‘上一页'按钮只有在还能导航到前一页的情况下才显示 布尔值 true
prev_text ‘上一页'显示的文字 字符串 Previous
num_edge_entries 如果设为1,那么永远会显示首页和末页 1或0 0
ellipse_text 从当前页码段到首页或末页之间的标识字符串 字符串 …
load_first_page 如果设置为true,那么回调函数将在插件初始化时就执行 布尔值 true

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
在textarea文本域中显示HTML代码的方法
Mar 06 Javascript
Firefox和IE浏览器兼容JS脚本写法小结
Jul 07 Javascript
jQuery窗口、文档、网页各种高度的精确理解
Jul 02 Javascript
webapp框架AngularUI的demo改造之路
Dec 21 Javascript
简介JavaScript中toTimeString()方法的使用
Jun 12 Javascript
轻松掌握JavaScript中的Math object数学对象
May 26 Javascript
javascript中使用未定义变量或值的情况分析
Jul 19 Javascript
javascript如何创建对象
Aug 29 Javascript
简单理解vue中track-by属性
Oct 26 Javascript
微信小程序返回多级页面的实现方法
Oct 27 Javascript
jQuery实现获取当前鼠标位置并输出功能示例
Jan 05 jQuery
vue监听dom大小改变案例
Jul 29 Javascript
jQuery插件multiScroll实现全屏鼠标滚动切换页面特效
Apr 12 #Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
Apr 12 #Javascript
jQuery插件Elastislide实现响应式的焦点图无缝滚动切换特效
Apr 12 #Javascript
jQuery插件Tooltipster实现漂亮的工具提示
Apr 12 #Javascript
jQuery插件MixItUp实现动画过滤和排序
Apr 12 #Javascript
jQuery实现简单二级下拉菜单
Apr 12 #Javascript
纯JS实现旋转图片3D展示效果
Apr 12 #Javascript
You might like
PHP手机号码归属地查询代码(API接口/mysql)
2012/09/04 PHP
总结PHP中DateTime的常用方法
2016/08/11 PHP
解决出现SoapFault (looks like we got no XML document)的问题
2017/06/24 PHP
用js实现随机返回数组的一个元素
2007/08/13 Javascript
jquery蒙版控件实现代码
2010/12/08 Javascript
基于jQuery的倒计时插件代码
2011/05/07 Javascript
Node.js中对通用模块的封装方法
2014/06/06 Javascript
禁止iframe脚本弹出的窗口覆盖了父窗口的方法
2014/09/06 Javascript
jquery+ajax验证不通过也提交表单问题处理
2014/12/12 Javascript
Bootstrap创建可折叠的组件
2016/02/23 Javascript
jQuery Ajax 实例代码 ($.ajax、$.post、$.get)
2016/04/29 Javascript
javascript显示倒计时控制按钮的简单实现
2016/06/07 Javascript
JavaScript中localStorage对象存储方式实例分析
2017/01/12 Javascript
js实现登录注册框手机号和验证码校验(前端部分)
2017/09/28 Javascript
JS脚本实现网页自动秒杀点击
2018/01/11 Javascript
Vue路由history模式解决404问题的几种方法
2018/09/29 Javascript
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
2019/06/17 Javascript
JS简易计算器实例讲解
2020/06/30 Javascript
vue 解决addRoutes多次添加路由重复的操作
2020/08/04 Javascript
Javascript节流函数throttle和防抖函数debounce
2020/12/03 Javascript
python中cPickle用法例子分享
2014/01/03 Python
python中使用OpenCV进行人脸检测的例子
2014/04/18 Python
Python2.x利用commands模块执行Linux shell命令
2016/03/11 Python
python验证身份证信息实例代码
2019/05/06 Python
python获取Linux发行版名称
2019/08/30 Python
Flask中endpoint的理解(小结)
2019/12/11 Python
在PyCharm中实现添加快捷模块
2020/02/12 Python
python脚本实现mp4中的音频提取并保存在原目录
2020/02/27 Python
Python headers请求头如何实现快速添加
2020/11/03 Python
使用Python获取爱奇艺电视剧弹幕数据的示例代码
2021/01/12 Python
英国图书音像网站:Hive.co.uk(图书、电子书、DVD、蓝光、音乐CD等)
2017/10/16 全球购物
联想瑞士官方网站:Lenovo Switzerland
2017/11/19 全球购物
文案策划求职信
2014/04/14 职场文书
学生会竞选演讲稿怎么写
2014/08/26 职场文书
Python tensorflow卷积神经Inception V3网络结构
2022/05/06 Python
JavaScript原型链中函数和对象的理解
2022/06/16 Javascript