您的位置:首页 > Web前端 > JQuery

jquery+Struts2实现ajax局部刷新分页

2016-01-21 10:57 190 查看
###我们先来看看传统的分页是什么样子



从URL中很明显的看出了分页的技术点,两个参数:一个是当前页page一个是页面大小size

我们甚至可以直接修改URL中的参数来跳转到相应的页面。下面几个按钮也是比较常见的。

###上面这种方式有什么弊端呢?

我简单总结一下:

1, get请求参数在url中,虽然也不是什么敏感的信息,但是一旦哪个用户传递过来的不是整数,

你后台要是不做处理肯定NumberFormatException!

2, 当换页的时候,后台处理请求然后将页面需要的数据准备好,再转到页面,然后数据填充到页面,

渲染页面,一个分页就需要将整个页面重新绘制一遍。要是页面就一张table还好说。但是如果页面

中有其它数据,你得从后台再获取一遍(虽然前后并没有什么变化)。再者,如果页面中有很多类似

的table你得在分页的同时保持其它table的状态信息(比如说其它table现在在第几页什么的,如果分页

后其它table的状态信息没有被保存,而是统一回到第一页,那体验是很不好的。)

###其实分页我们关心的也只是table中的数据变换

分页我们原本只需要关心当前table中的数据更新,我们并不想”多管闲事“。当我切换页面的时候只

需要后台将”当前页“的数据替换成最新的数据,其它页面元素不需要多的变动。ajax局部刷新技术

正好可以解决这个问题。

###下面是效果图





可以看到虽然切换了页面,但是URL并没有改变。而且不像前面的get请求那样,这里页面不会刷,只改变

局部数据。

###结合jquery.twbsPagination.js插件实现的分页效果







内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: