jQuery插件分享之分页插件jqPagination


Posted in Javascript onJune 06, 2014

使用方法:

添加 jQuery 类库、jqPagination 插件的 JS 和 CSS 文件

<link rel="stylesheet" href="jqpagination.css"/>
<script src="jquery-1.6.2.min.js"></script>
<script src="jquery.jqpagination.min.js"></script>

再需要如下HTML

<div class="pagination">
  <a href="#" class="first" data-action="first">«</a>
  <a href="#" class="previous" data-action="previous">‹</a>
  <input type="text" readonly="readonly" data-max-page="40" />
  <a href="#" class="next" data-action="next">›</a>
  <a href="#" class="last" data-action="last">»</a>
</div>

最后初始化插件

$('.pagination').jqPagination({
  link_string : '/?page={page_number}',
  current_page: 5, //设置当前页 默认为1
  max_page : 40, //设置最大页 默认为1
  page_string : '当前第{current_page}页,共{max_page}页',
  paged : function(page) {
      //回发事件。。。
      }
});
Javascript 相关文章推荐
jQuery 插件仿百度搜索框智能提示(带Value值)
Jan 22 Javascript
JS对img标签进行优化使用onerror显示默认图像
Apr 24 Javascript
js实现图片从左往右渐变切换效果的方法
Feb 06 Javascript
JS生成某个范围的随机数【四种情况详解】
Apr 20 Javascript
JavaScript prototype属性详解
Oct 25 Javascript
浅析JavaScript动画模拟拖拽原理
Dec 09 Javascript
关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)
Dec 14 Javascript
深入掌握 react的 setState的工作机制
Sep 27 Javascript
详解Nuxt.js部署及踩过的坑
Aug 07 Javascript
vue.extend与vue.component的区别和联系
Sep 19 Javascript
使用layer弹窗提交表单时判断表单是否输入为空的例子
Sep 26 Javascript
vue scroll滚动判断的实现(是否滚动到底部、滚动方向、滚动节流、获取滚动区域dom元素)
Jun 11 Javascript
javascript中的return和闭包函数浅析
Jun 06 #Javascript
seaJs的模块定义和模块加载浅析
Jun 06 #Javascript
使用GruntJS构建Web程序之Tasks(任务)篇
Jun 06 #Javascript
javascript中加号(+)操作符的一些神奇作用
Jun 06 #Javascript
使用GruntJS构建Web程序之合并压缩篇
Jun 06 #Javascript
Javascript动态引用CSS文件的2种方法介绍
Jun 06 #Javascript
jquery 隐藏与显示tr标签示例代码
Jun 06 #Javascript
You might like
php stream_get_meta_data返回值
2013/09/29 PHP
php switch语句多个值匹配同一代码块的实现
2014/03/03 PHP
YII2框架中添加自定义模块的方法实例分析
2020/03/18 PHP
分享别人写的一个小型js框架
2007/08/13 Javascript
JavaScript 数组的 uniq 方法
2008/01/23 Javascript
jQeury淡入淡出需要注意的问题
2010/09/08 Javascript
js两行代码按指定格式输出日期时间
2011/10/21 Javascript
Extjs 3.3切换tab隐藏相应工具栏出现空白解决
2013/04/02 Javascript
Javascript 命名空间模式
2013/11/01 Javascript
JS简单的图片放大缩小的两种方法
2013/11/11 Javascript
jQuery中使用Ajax获取JSON格式数据示例代码
2013/11/26 Javascript
JS获取浏览器语言动态加载JS文件示例代码
2014/10/31 Javascript
jQuery实现设置、移除文本框默认值功能
2015/01/13 Javascript
javascript实现checkbox复选框实例代码
2016/01/10 Javascript
JQuery Mobile 弹出式登录框的实现方法
2016/05/28 Javascript
JS生成不重复的随机数组的简单实例
2016/07/10 Javascript
jquery-mobile基础属性与用法详解
2016/11/23 Javascript
使用Bootstrap美化按钮实例代码(demo)
2017/02/03 Javascript
bootstrap Table插件使用demo
2017/08/07 Javascript
webpack3+React 的配置全解
2017/08/21 Javascript
实现div滚动条默认最底部以及默认最右边的示例代码
2017/11/15 Javascript
Vue.js 动态为img的src赋值方法
2018/03/14 Javascript
angular 实现同步验证器跨字段验证的方法
2019/04/11 Javascript
小程序跳转H5页面的方法步骤
2020/03/06 Javascript
vue中用 async/await 来处理异步操作
2020/07/18 Javascript
从零学python系列之浅谈pickle模块封装和拆封数据对象的方法
2014/05/23 Python
Python下的Softmax回归函数的实现方法(推荐)
2017/01/26 Python
Python 机器学习库 NumPy入门教程
2018/04/19 Python
详解Python连接MySQL数据库的多种方式
2019/04/16 Python
Python tkinter制作单机五子棋游戏
2020/09/14 Python
python pygame 愤怒的小鸟游戏示例代码
2021/02/25 Python
HTML5+CSS3实现机器猫
2016/10/17 HTML / CSS
高尔夫球鞋、服装、手套和装备:FootJoy
2018/12/15 全球购物
百日安全生产活动总结
2014/07/05 职场文书
2014年英语教学工作总结
2014/12/17 职场文书
2016党校学习心得体会范文
2016/01/07 职场文书