javascript实现分页功能

分页技术分为后端分页和前端分页。

前端分页

将数据一次性全部取出来，然后通过js进行分页，有其弊端：假设有商品表dbgoods，存放99999万条数据 ，执行查询语句
select *from dbgoods where 1=1 将查询结构用List<goods>list 进行接收，服务端将这么庞大的数据量传递给前端，会造成下载量大（流量都是钱），服务器压力大等。

后端分页

后端分页是每次请求只查询一页的值，以mysql为例(查询第一条开始，查询8条)

后端同步分页

原理：需要有个Bean记录分页的信息，

当我们首次加载时，加载的是第一页的分页数据：

值得注意的是

以前我是这样编写sql语句得到总条数的：

其实正确的打开方式是：

同步实现异步，从jsp界面传递currentpage参数到servlet，servlet通过request请求得到参数，通过dao层数据库查询后将数据再传会到jsp界面。

浏览器看到的界面效果是：jsp--->servlet----->jsp（跳转，用户体验不好）

如果有搜索框，在进行搜索分页时，点击搜索按钮，等到查询数据传递到jsp界面时，jsp已经是个全新的页面，搜索框里的文本框内容已经消失，解决方法就是在点击搜索的时候，将文本框的值也放在request请求，一起发给servlet，再通过servlet传递到新的jsp （超级繁琐）

两种解决方法：

（1）做两个界面一样的，一个用于显示全部数据情况下的分页，当点击查询时，得到数据后用另外的页面（下一页点击事件是去执行搜索的情况）去显示

（2）使用session：当点击搜索查询时，将搜索条件记录在session里面，当点击下一页时，去判断session的值，如果是空，则执行全部数据的下一页，如果不为空，则将session的值取出来，作为查询的条件，下一页执行 有搜索条件的查询语句。麻烦点：session的销毁不好控制，容易bug

总之，用同步实现分页，会有各种不开心

Ajax异步分页

初次加载时，默认调用

值得注意的是，重点来了：

我们进行搜索的时候，定义一个全局的变量mydata，作用域为page

下面看下点击 搜索按钮的事件代码

解决同步的搜索情况下的下一页访问到的是全部数据的下一页问题：

由于是异步刷新，所以全局变量mydata是有值的，手动自己刷新页面重新加载，mydata就会初始化为空，就又默认执行 无条件搜索语句。巧妙的解决了搜索和显示全部的下一页问题，上一页首页尾页同理。

以上就是javascript实现分页功能的详细内容，更多请关注Gxl网其它相关文章！