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 相关文章推荐
JS 创建对象(常见的几种方法)
Nov 03 Javascript
jquery 鼠标滑动显示详情应用示例
Jan 24 Javascript
jQuery 和 CSS 的文本特效插件集锦
Dec 12 Javascript
了不起的node.js读书笔记之node的学习总结
Dec 22 Javascript
animate 实现滑动切换效果【实例代码】
May 05 Javascript
Bootstrap CSS组件之输入框组
Dec 17 Javascript
Vue2.0学习系列之项目上线的方法步骤(图文)
Sep 25 Javascript
使用layui实现的左侧菜单栏以及动态操作tab项方法
Sep 10 Javascript
Weex开发之地图篇的具体使用
Oct 16 Javascript
jQuery实现中奖播报功能(让文本滚动起来) 简单设置数值即可
Mar 20 jQuery
React实现全选功能
Aug 25 Javascript
jQuery-App输入框实现实时搜索
Nov 19 jQuery
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实现的获取URL信息的类
2007/01/02 PHP
PHP 抓取新浪读书频道的小说并生成txt电子书的代码
2009/12/18 PHP
如何使用jQuery+PHP+MySQL来实现一个在线测试项目
2015/04/26 PHP
关于laravel5.5的定时任务详解(demo)
2019/10/23 PHP
javascript 点击整页变灰的效果(可做退出效果)。
2008/01/09 Javascript
jQuery的Ajax的自动完成功能控件简要说明
2013/02/22 Javascript
JS添加删除一组文本框并对输入信息加以验证判断其正确性
2013/04/11 Javascript
javascript弹出层输入框(示例代码)
2013/12/11 Javascript
分享9个最好用的JavaScript开发工具和代码编辑器
2015/03/24 Javascript
JavaScript判断是否为数组的3种方法及效率比较
2015/04/01 Javascript
javascript html5摇一摇功能的实现
2016/04/19 Javascript
解决JS组件bootstrap table分页实现过程中遇到的问题
2016/04/21 Javascript
layer弹窗插件操作方法详解
2017/05/19 Javascript
web前端vue之vuex单独一文件使用方式实例详解
2018/01/11 Javascript
Vue中保存数据到磁盘文件的方法
2018/09/06 Javascript
通过vue手动封装on、emit、off的代码详解
2019/05/29 Javascript
Nuxt.js 静态资源和打包的操作
2020/11/06 Javascript
python爬虫入门教程--利用requests构建知乎API(三)
2017/05/25 Python
Python实现多进程共享数据的方法分析
2017/12/04 Python
TensorFlow实现简单卷积神经网络
2018/05/24 Python
对Tensorflow中权值和feature map的可视化详解
2018/06/14 Python
Python 使用 Pillow 模块给图片添加文字水印的方法
2019/08/30 Python
python 内置函数汇总详解
2019/09/16 Python
Python实现中值滤波去噪方式
2019/12/18 Python
selenium中get_cookies()和add_cookie()的用法详解
2020/01/06 Python
python opencv图像处理(素描、怀旧、光照、流年、滤镜 原理及实现)
2020/12/10 Python
详解Python中openpyxl模块基本用法
2021/02/23 Python
Web前端页面跳转并取到值
2017/04/24 HTML / CSS
Steve Madden官网:美国鞋类品牌
2017/01/29 全球购物
美国礼品卡交易网站:Cardpool
2018/08/27 全球购物
学校校庆演讲稿
2014/05/22 职场文书
市委召开党的群众路线教育实践活动总结大会报告
2014/10/21 职场文书
运动会通讯稿600字
2015/07/20 职场文书
入党心得体会
2019/06/20 职场文书
蓝天保卫战收官在即 :15行业将开展环保分级评价
2019/07/19 职场文书
JVM入门之类加载与字节码技术(类加载与类的加载器)
2021/06/15 Java/Android