51工具盒子好像还没分享过有关分页的文章，最近做了一个活动页面，统计用户中奖数据，需要用到分页，先前都是开发做的分页效果，效果很一般，代码也复杂。
这次活动想尝试新的分页，无意间发现一款不错的jQuery插件：Cypager。
它可以传入总页数和每页显示条数，可设置显示多少位数字，ajax请求后台返回当前页条数。
说明：
jQuery可点击回调的分页插件,cypager一款强大的支持分页效果的,样式有点类似bootstrap分页。上一页、下一页加载前的回调效果。cypager插件兼容 IE8+,Chrome,Firefox 浏览器,核心文件仅 5KB。
调用：
调用jQuery库、cypager.js和css，如下：
<script src="js/jquery-1.7.2.min.js"></script>
<link rel="stylesheet" href="css/cypager.min.css" />
<script type="text/javascript" src="js/cypager.min.js" ></script>
这里说明下，jQuery库文件需要1.7.2或以上版本。
那么如何生成分页效果呢，看下如下代码：
<div id="pagerArea" unselectable="on" onselectstart="return false;"></div>
$("#pagerArea").cypager({pg_size: 10, pg_nav_count: 8, pg_total_count: 194, pg_call_fun: function(count) {
$("#console").html("正在加载第(" + count + ")页的数据，请稍后.......");
}
});
cypager分页插件也有一些API参数：
|-------------------------|-------------|----------| | 参数 | 描述 | 默认值 | | pgerId | 插件的ID | cy_pager | | pg_size | 每页显示记录数 | 10 | | pg_cur_count | 当前页数 | - | | pg_total_count | 总记录数 | - | | pg_nav_count | 显示多少个导航数 | 7 | | pg_prev_name | 上一页按钮名称 | PREV | | pg_next_name | 下一页按钮名称 | NEXT | | pg_call_fun(page_count) | 回调函数，点击按钮执行 | - |
差不多就介绍到这里了，实际应用我们可以看下具体案例：DEMO。
总结
cypager jQuery分页插件是我目前觉得最轻便的一款了，所以拿出来分享下。如果您有更好的，请留言，谢谢。
