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 相关文章推荐
javascript while语句和do while语句的区别分析
Dec 08 Javascript
JS实现图片横向滚动效果示例代码
Sep 04 Javascript
jQuery中click事件用法实例
Dec 26 Javascript
javascript实现table选中的行以指定颜色高亮显示的方法
May 13 Javascript
jquery事件的ready()方法使用详解
Nov 11 Javascript
详解Document.Cookie
Dec 25 Javascript
AngularJS 表达式详细讲解及实例代码
Jul 26 Javascript
最实用的jQuery分页插件
Oct 09 Javascript
vue.js开发环境安装教程
Mar 17 Javascript
ES6模块化的import和export用法方法总结
Aug 08 Javascript
如何使用Node.js爬取任意网页资源并输出PDF文件到本地
Jun 17 Javascript
vue中使用百度脑图kityminder-core二次开发的实现
Sep 26 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获取本周第一天和最后一天示例代码
2014/02/24 PHP
PHP中使用localhost连接Mysql不成功的解决方法
2014/08/20 PHP
PHP使用第三方即时获取物流动态实例详解
2017/04/27 PHP
thinkPHP框架实现多表查询的方法
2018/06/14 PHP
Javascript日期对象的dateAdd与dateDiff方法
2008/11/18 Javascript
使用js 设置url参数
2013/07/08 Javascript
jquery增加和删除元素的方法
2015/01/14 Javascript
javascript实现下雪效果【实例代码】
2016/05/03 Javascript
BootStrap table使用方法分析
2016/11/08 Javascript
JavaScript Canvas绘制圆形时钟效果
2020/08/20 Javascript
JavaScript ES6中const、let与var的对比详解
2017/06/18 Javascript
使用微信小程序开发弹出框应用实例详解
2018/10/18 Javascript
详解Python中的各种函数的使用
2015/05/24 Python
Python中list初始化方法示例
2016/09/18 Python
python使用ddt过程中遇到的问题及解决方案【推荐】
2018/10/29 Python
对Python定时任务的启动和停止方法详解
2019/02/19 Python
详解Pandas之容易让人混淆的行选择和列选择
2019/07/10 Python
wxPython多个窗口的基本结构
2019/11/19 Python
Python selenium使用autoIT上传附件过程详解
2020/05/26 Python
在django中实现choices字段获取对应字段值
2020/07/12 Python
Python3爬虫发送请求的知识点实例
2020/07/30 Python
Pandas的数据过滤实现
2021/01/15 Python
香蕉共和国加拿大官网:Banana Republic加拿大
2018/08/06 全球购物
Yankee Candle官网:美国最畅销蜡烛品牌之一
2020/01/05 全球购物
大学生最常用的自我评价
2013/12/07 职场文书
小学生演讲稿
2014/01/12 职场文书
创业者迈进成功第一步:如何写创业计划书?
2014/03/22 职场文书
群众路线领导干部个人对照检查材料(集锦)
2014/09/23 职场文书
债务授权委托书范本
2014/10/17 职场文书
高三毕业评语
2014/12/31 职场文书
2015年元宵节活动总结
2015/02/06 职场文书
幼儿园园长安全责任书
2015/05/08 职场文书
2015年初三班主任工作总结
2015/05/21 职场文书
湘江北去观后感
2015/06/15 职场文书
音乐课《小猫钓鱼》教学反思
2016/02/18 职场文书
Python开发之QT解决无边框界面拖动卡屏问题(附带源码)
2021/05/27 Python