jQuery分页小插件

源码如下：

1. $.fn.pager = function (pagerInfo) {
2. var recordCount = this.size();
3. if (recordCount <= pagerInfo.pagesize) return;
4. var currentPageIndex = 1, //当前面，默认为1
5. pageCount = Math.ceil(recordCount / pagerInfo.pagesize); //总页数
6. //构建分页的html
7. $('<div>一共' + this.size() + '条记录,一共' + pageCount + '页,当前第<span>1</span>页</div>')
8. .insertAfter(pagerInfo.container)
9. .append($('<a class="prev-page">上一页</a>').click(function () {
10. if (currentPageIndex == 1) return;
11. currentPageIndex--;
12. showRecords(currentPageIndex);
13. $(this).prev('span').text(currentPageIndex);
14. }))
15. .append($('<a class="prev-page" href>下一页</a>').click(function () {
16. if (currentPageIndex == pageCount) return;
17. currentPageIndex++;
18. showRecords(currentPageIndex);
19. $(this).prevAll('span').text(currentPageIndex);
20. }))
21. .css(pagerInfo.css)
22. .find('span').css({ padding: 0 });
23. var jRecords = this;  //保留作用域
24. //pageIndex以1为开始
25. var showRecords = function (pageIndex) {
26. jRecords.hide();  //隐匿所有记录先
27. var startIndex = (pageIndex - 1) * pagerInfo.pagesize,  //当前页的开始记录
28. endIndex = (pageIndex * pagerInfo.pagesize) - 1;   //当前页的结束记录
29. jRecords.filter(':eq(' + startIndex + '),:gt(' + startIndex + ')').show();  //显示大于开始记录（包含）的所有记录
30. jRecords.filter(':gt(' + endIndex + ')').hide();  //隐藏大于结束记录的所有记录，以达到分页效果
31. };
32. showRecords(currentPageIndex);
33. };

使用举例：

1. $('#feedback ul li')  //数据源
2. .pager({
3. pagesize: 10, //分页大小
4. container: $('#feedback'), //容纳分页html的容器
5. css: { 'margin-left': '40px'} //分页html的样式
6. });