如何创建Stack Overflow站点的分页

如何创建像stackoverflow一样的分页？

Answer 1

您没有说明您正在使用哪种服务器端技术，但如果您想要一个纯客户端解决方案，您可以查看jQuery Pagination插件。 这是一个演示页面 。

Answer 2

只需在页面中包含jquery和jquery pagination插件，然后使用它，

$(document).ready(function() { $(".pager").pagination(300, { callback: pagecallback, current_page: 0, items_per_page: 5, num_display_entries: 5, next_text: 'Next', prev_text: 'Prev', num_edge_entries: 1 }); }); 

 .pager { margin-bottom: 10px; margin-top: 10px; } .page-numbers { border: 1px solid #CCCCCC; color: #808185; display: block; float: left; font-family: Trebuchet MS, Helvetica, sans-serif; font-size: 130%; margin-right: 3px; padding: 4px 4px 3px; text-decoration: none; } .page-numbers.desc { border: medium none; } .page-numbers:hover { text-decoration: none; } .pager a { color: #808185; cursor: pointer; text-decoration: none; outline: none; } .pager a:hover { text-decoration: underline; } .pager a:visited { color: #808185; outline: none; } .page-numbers.next, .page-numbers.prev { border: 1px solid #CCCCCC; } .page-numbers.current { background-color: #808185; border: 1px solid #808185; color: #FFFFFF; font-weight: bold; } .page-numbers.dots { border: 1px solid #FFFFFF; } 

Answer 3

使用Jquery插件分页：

http://plugins.jquery.com/project/pagination

Answer 4

您可以使用twitter引导程序创建分页，其代码少于10行

Answer 5

这对我来说非常好。 由于这不是javascript，禁用javascript的用户也可以使用它。

Answer 6

你也可以使用这个function：

 function makePaging(totalPages, pageIndex) { var oPaging, i, j, k; var totalPages = parseInt(totalPages); pageIndex++; i = pageIndex; j = pageIndex - 1; k = pageIndex + 1; var oBefore, oAfter; oBefore = ""; oAfter = ""; while (j != 0 && j != i - 6) { oBefore = "" + j + " " + oBefore; j--; } for (; k < totalPages + 1 && k < i + 6; k++) { oAfter += "" + k + " "; } oPaging = oBefore + "" + i.toString() + " " + oAfter; return oPaging; }