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 Tips(2) 关于$()包装集你不知道的
Dec 14 Javascript
javascript权威指南 学习笔记之变量作用域分享
Sep 28 Javascript
js setTimeout 参数传递使用介绍
Aug 13 Javascript
jquery取子节点及当前节点属性值的方法
Sep 09 Javascript
基于javascript实现单选及多选的向右和向左移动实例
Jul 25 Javascript
学习JavaScript设计模式之责任链模式
Jan 18 Javascript
Vue.js每天必学之表单控件绑定
Sep 05 Javascript
详解Sea.js中Module.exports和exports的区别
Feb 12 Javascript
Vue Ajax跨域请求实例详解
Jun 20 Javascript
javascript、php关键字搜索函数的使用方法
May 29 Javascript
JavaScript查看代码运行效率console.time()与console.timeEnd()用法
Jan 18 Javascript
Javascript删除数组里的某个元素
Feb 28 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
玛琪朵 Macchiato
2021/03/03 咖啡文化
php缓冲 output_buffering的使用详解
2013/06/13 PHP
PHP COOKIE及时生效的方法介绍
2014/02/14 PHP
老生常谈php 正则中的i,m,s,x,e分别表示什么
2017/03/02 PHP
PHP实现的文件上传类与用法详解
2017/07/05 PHP
php中加密解密DES类的简单使用方法示例
2020/03/26 PHP
JQuery获取表格数据示例代码
2014/05/26 Javascript
node.js中的path.delimiter方法使用说明
2014/12/09 Javascript
基于jQuery实现仿百度首页换肤背景图片切换代码
2015/08/25 Javascript
浅析nodejs实现Websocket的数据接收与发送
2015/11/19 NodeJs
轻松学习jQuery插件EasyUI EasyUI创建树形菜单
2015/11/30 Javascript
利用jQuery设计一个简单的web音乐播放器的实例分享
2016/03/08 Javascript
vue+vuecli+webpack中使用mockjs模拟后端数据的示例
2017/10/24 Javascript
vue-cli 脚手架基于Nightwatch的端到端测试环境的过程
2018/09/30 Javascript
vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转)
2019/05/10 Javascript
微信小程序实现聊天室
2020/08/21 Javascript
python基础教程之元组操作使用详解
2014/03/25 Python
python字符串的常用操作方法小结
2016/05/21 Python
浅谈编码,解码,乱码的问题
2016/12/30 Python
Sanic框架蓝图用法实例分析
2018/07/17 Python
python3中numpy函数tile的用法详解
2019/12/04 Python
关于Pytorch MaxUnpool2d中size操作方式
2020/01/03 Python
基于tensorflow指定GPU运行及GPU资源分配的几种方式小结
2020/02/03 Python
Python datetime 如何处理时区信息
2020/09/02 Python
浅析Python 责任链设计模式
2020/09/11 Python
Python jieba库分词模式实例用法
2021/01/13 Python
浅谈html5 响应式布局
2014/12/24 HTML / CSS
酒店管理专业毕业生推荐信
2013/11/10 职场文书
外语系毕业生找工作的求职信
2013/11/28 职场文书
交通安全演讲稿
2014/01/07 职场文书
材料专业大学毕业生自荐书
2014/07/02 职场文书
医院安全生产月活动总结
2014/07/05 职场文书
趣味运动会新闻稿
2015/07/17 职场文书
微信小程序结合ThinkPHP5授权登陆后获取手机号
2021/11/23 PHP
Mysql忘记密码解决方法
2022/02/12 MySQL
关于mysql中string和number的转换问题
2022/06/14 MySQL