在实际编程中,经常需要把大量数据分页显示,并且要提供一个分页导航栏供用户选择。现总结出一个用于常规分页的公式,这个公式比较简洁而且具有普适性。
页数
=(
记录总数
+
每页记录数
-1)/
每页记录数
注意,这里的除法是整除。举例验证,假设总记录数为
10
条,要求每页显示
5
条,则页数
=(10+5-1)/5=2
。若总记录数改为
11
条,仍然要求每页显示
5
条,则页数
=(11+5-1)/5=3
。这与实际情况是如符合的。
除此之外,还需要给用户提供一个分页导航栏,便于用户翻页。笔者观察过很多网站的分页导航栏,认为
Google
的分页导航栏是最好的。它提供了页码和上下翻动两种方式,而且导航栏上显示的页码总是与当前页的页码相邻的若干个数。
(a)
当前页为第
1
页
(b)
当前页为第
8
页
(c)
当前页为最后一页
图
4.5 Google
的分页导航栏
经过观察不难发现,
Google
的分页导航栏的页码显示有这样一个规律。就是当前页码的左侧最多显示
10
个比它小的页码,右侧最多显示
9
个比它大的页码。那么基本的思路就是这样的,已知当前页码为
N
,则导航栏页码左边界暂设为
N-10
,如果
N-10<1
,再调整左边界为
1
。导航栏页码右边界暂设为
N+9
,如果
N+9>
总页数,再调整右边界为总页数。我们可以验证一下,图
4.3(b)
中,当前页为
8, 8-10= -2
,
-2
小于
1
,所以左边界调整为
1
。
8+9=17
,
17<24
(总页数),所以右边界仍为
17
。具体的
JavaScript
实现代码如下所示:
function showpager(cur,max){
var beindex=cur-10; //
假定左边界
var endindex=cur+9; //
假定右边界
if(beindex<1)beindex=1; //
微调
if(endindex>max)endindex=max;
if(cur>1)document.write("<a href='Board.aspx?pageno="+(cur-1)+"'>
上一页
</a> ");
for(i=beindex;i<=endindex;i++){
if(i==cur){
document.write("<strong>"+i+"<strong> ");
}
else{
document.write("<a href='Board.aspx?pageno="+i+"'>"+i+"</a> ");
}
}
if(cur<max){
document.write("<a href='Board.aspx?pageno="+(cur+1)+"'>
下一页
</a>");
}
}