分页 (pagination) 一种自动分页机制，可以将移动 Web 窗体中的内容分割成一组组较小的页进行呈现，以适合于特定的设备。该机制还呈现可用于浏览到其他页的用户界面元素.在整个的web开发应用中分页是必会的知识点。应该熟练掌握与运用。
在实际开发的应用中,分页显的尤为重要,现将baidu,google查询分页显示的页面及分页效果分析如下：
1
、baidu搜索观察分页效果如下：
2
、Google搜索分页效果实现如下：
分析流程结构：
|
页面显示的页码
|
当前页
|
末页
|
分析
|
|
1 2 3 4 5 6 7 8 9 10
下一页
|
1
|
10
|
10=1+9
|
|
分析1：当总页数小于11时,
页面索引起始值=1;
页面索引最终值=总页数;
| |||
|
上一页 1 2 3 4 5 6 7 8 9 10 11 下一页
|
2
|
11
|
11=2+9
|
|
上一页 1 2 3 … … 9 10 11 12 下一页
|
3
|
12
|
12=3+9
|
|
上一页 1 2 3 … …10 11 12 13 下一页
|
4
|
13
|
13=4+9
|
|
上一页 1 2 3 … …11 12 13 14 下一页
|
5
|
14
|
14=5+9
|
|
上一页 1 2 3 … …12 13 14 15 下一页
|
6
|
15
|
15=6+9
|
|
上一页 1 2 3 … …13 14 15 16 下一页
|
7
|
16
|
16=7+9
|
|
上一页 1 2 3 … …16 17 18 20 下一页
|
11
|
20
|
20=11+9
|
|
注意观察
| |||
|
上一页 2 3 4 … …18 29 20 21 下一页
|
12
|
21
|
2=12-10 21=12+9
|
|
上一页 3 4 5 … …19 20 21 22 下一页
|
13
|
22
|
3=13-10 22=13+9
|
|
上一页 4 5 6 … … 20 21 22 23 下一页
|
14
|
23
|
4=14-10 23=13+9
|
|
分析2：当
总页数大于
11页面上显示的总共页码为20,其中以上观察可知：
页面索引起始值=当前页-10;
页面索引最终值=当前页+9;
注意：当页面的
索引最终值大于查询的总页数时,那么效果应该如下：
页面索引最终值=查询的总页数;
页面索引起始值=查询的总页数-19;
| |||
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
