在网页制作中,内容的显示通常有两种方式,一种是分页的。
这种显示方式一般用在PC上的新闻,或者信息的显示。
还有一种方式是随着我们不断的下拉,内容不断的出现的瀑布流方式。
比如简书就是这种方式。(只要内容没显示完,右边的滚动条是怎么都拉不到底的)
今天先来聊聊分页功能。(瀑布流下次再聊)
1.Jquery
我以前做分页功能的时候,一般使用jquery来实现,实现代码如下。
实现的过程也很简单,想要实现分页,我们需要知道两个参数,一个是一共有多少页,另一个是当前页应该显示那几个数据。
总页数比较简单,我们只要知道表格一共有多少行就行。($("#tablelist").rows.length)
另一个是当前应该显示哪几个数据。
假设每页显示10个数据,那么我们只需要知道当前是第几页,数据是否结束就可以了。
如果我们知道是第一页,最后一个数据是8,小于10,那么就显示18。如果最后一个数是12,大于10,那就显示110。
所以在代码中,结束行=当前页数*每页的显示数量。
但是拿到结束行之后还要跟行数做对比,结束行如果大于行数,则显示行数,否则显示结束行。
但是这样实现之后是计算一次的,那我们点击按钮需要动态实现,所以让分页的按钮重新调用goPage函数。
这是比较传统的办法,但是还有一种异步刷新的办法也可以实现。
2.Ajax
用Ajax实现的思想是一样的,也是先计算总页数,然后计算当前应该显示哪几个数据,但是Ajax有一点不一样的地方是,它是通过数据库实现计算的。
我建了个简单的数据库做测试。
先获得数据的总数(select count(username) from user)
然后获得特定的数据并显示。(比如显示第2跟第5之间的数据)
我们只要把开始和结束两个参数传入数据库,就可以显示出特定的数据。这里为了方便,这里直接将数据库绑定到DataSet上。
然后只要在前台将数据反序列化显示出来就行。