一,样式中引用paging.css样式即可
二,dom结构如下:
<div id="pageTool"></div> <div id="pageToolbar"></div>
对应的相应js
<script type="text/javascript" src="../src/jquery-1.11.2.js"></script> <script type="text/javascript" src="../src/query.js"></script> <script type="text/javascript" src="../src/paging.js"></script> <script> $('#pageTool').Paging({pagesize:10,count:100,callback:function(page,size,count){ console.log(arguments) alert('当前第 ' +page +'页,每页 '+size+'条,总页数:'+count+'页') }}); $('#pageToolbar').Paging({pagesize:10,count:85,toolbar:true}); </script>
使用这个插件注意要点:可以额外配置一个 “current”参数初始化起始页码;
var $page = 6;
$('#pageToolbar').Paging({ current: $page, //这个可以设置初始页数 pagesize: 5, count: 100, toolbar: true, callback: function(page, size, count) { self.selPermissions(page, size); } });
可以把 paging.js里第53行的:
this.target.append(this.container);
改成:
this.target.html(this.container);
这样配合异步请求,每次调用这个函数时就不会重复创建出多个分页栏