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 相关文章推荐
jquery.alert 弹出式复选框实现代码
Jun 15 Javascript
javascript 获取url参数和script标签中获取url参数函数代码
Jan 22 Javascript
cnblogs TagCloud基于jquery的实现代码
Jun 11 Javascript
获取body标签的两种方法
Oct 13 Javascript
ExtJs默认的字体大小改变的几种方法(自己整理)
Apr 18 Javascript
获取select元素被选中的文本内容的js代码
Jan 29 Javascript
BAT及各大互联网公司2014前端笔试面试题--JavaScript篇
Oct 29 Javascript
node.js中的fs.readFile方法使用说明
Dec 15 Javascript
JavaScript使用RegExp进行正则匹配的方法
Jul 11 Javascript
jQuery设计思想
Mar 07 Javascript
如何在 JavaScript 中更好地利用数组
Sep 27 Javascript
关于对TypeScript泛型参数的默认值理解
Jul 15 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/10/31 PHP
php获取指定日期之间的各个周和月的起止时间
2014/11/24 PHP
利用php抓取蜘蛛爬虫痕迹的示例代码
2016/09/30 PHP
PHP SFTP实现上传下载功能
2017/07/26 PHP
PHP利用百度ai实现文本和图片审核
2019/05/08 PHP
用javascript父窗口控制只弹出一个子窗口
2007/04/10 Javascript
Ext JS Grid在IE6 下宽度的问题解决方法
2009/02/15 Javascript
Javascript创建Silverlight Plugin以及自定义nonSilverlight和lowSilverlight样式
2010/06/28 Javascript
JQuery实现鼠标滑过显示导航下拉列表
2013/09/12 Javascript
利用javascript实现web页面中指定区域打印
2013/10/30 Javascript
最短的IE判断var ie=!-[1,]分析
2014/05/28 Javascript
jQuery焦点控制图层展示延迟隐藏的方法
2015/03/09 Javascript
JavaScript中Cookies的相关使用教程
2015/06/04 Javascript
ionic开发中点击input时键盘自动弹出
2016/12/23 Javascript
node koa2实现上传图片并且同步上传到七牛云存储
2017/07/31 Javascript
使用重写url机制实现验证码换一张功能
2017/08/01 Javascript
[44:43]完美世界DOTA2联赛决赛日 FTD vs GXR 第一场 11.08
2020/11/11 DOTA
实践Python的爬虫框架Scrapy来抓取豆瓣电影TOP250
2016/01/20 Python
Python 多线程实例详解
2017/03/25 Python
Python中模块与包有相同名字的处理方法
2017/05/05 Python
Python画柱状统计图操作示例【基于matplotlib库】
2018/07/04 Python
python关于矩阵重复赋值覆盖问题的解决方法
2019/07/19 Python
python中类的输出或类的实例输出为这种形式的原因
2019/08/12 Python
Python定时发送天气预报邮件代码实例
2019/09/09 Python
Python Opencv实现单目标检测的示例代码
2020/09/08 Python
Gap英国官网:Gap UK
2018/07/18 全球购物
Java的基础面试题附答案
2016/01/10 面试题
HttpServlet类中的主要方法都有哪些?各自的作用是什么?
2014/03/16 面试题
餐饮企业总经理岗位职责范文
2014/02/18 职场文书
公共艺术专业自荐信
2014/09/01 职场文书
毕业实习证明范本
2015/06/16 职场文书
歌咏比赛主持词
2015/06/29 职场文书
Go遍历struct,map,slice的实现
2021/06/13 Golang
24年收藏2000多部退役军用电台
2022/02/18 无线电
Java生成日期时间存入Mysql数据库的实现方法
2022/03/03 Java/Android
Java GUI编程菜单组件实例详解
2022/04/07 Java/Android