Yangerle/jQuery.pagination

可定制的jQuery分页插件。

jQuery pagination

• jQuery pagination
  • 介绍
  • 使用方法
    • script标签引入
    • AMD方式引入
    • Node平台CommonJS方式引入

介绍

pagination是基于jQuery开发的分页插件。

它支持自定义页面总数、显示数以及切换页面回调函数。

使用方法

注：样式文件jquery.pagination.css要手动引入；img文件夹（包含图片）要和jquery.pagination.js放在同级目录

script标签引入

<!--class="page-switch"是固定的，因为要加载默认样式-->
<div class="page-switch" id="pageSwitch"></div>

<script src="jquery.js"></script>
<script src="jquery.pagination.js"></script>

使用：

$.pagination({
 totalPage:50,//告知分页总页数
 selector:'#pageSwitch',//传入分页元素id
 showNum:12,//设定分页要展示出的数字数目
 callback:function () {//页面切换后的回调
     console.log('gogogo')
 }
});

AMD方式引入

<!--class="page-switch"是固定的，因为要加载默认样式-->
<div class="page-switch" id="pageSwitch"></div>

//requirejs按如下配置jQuery：
require.config({
 paths: {
     "jquery": "lib/jquery.min",
 }
});

使用：

require(['lib/jquery.pagination'],function(){
 $.pagination({
     totalPage:50,//告知分页总页数
     selector:'#pageSwitch',//传入分页元素id
     showNum:12,//设定分页要展示出的数字数目
     callback:function () {//页面切换后的回调
         console.log('gogogo')
     }
 });
})

Node平台CommonJS方式引入

<!--class="page-switch"是固定的，因为要加载默认样式-->
<div class="page-switch" id="pageSwitch"></div>

npm install jquery.pagination

使用：

require("jquery.pagination");
$.pagination({
 totalPage:50,//告知分页总页数
 selector:'#pageSwitch',//传入分页元素id
 showNum:12,//设定分页要展示出的数字数目
 callback:function () {//页面切换后的回调
     console.log('gogogo')
 }
});