需求:
页面上的结果集列表有多条记录,选中某一行进行操作时,页面可能已经滚动过一段距离,当点击提交时希望能记录滚动过的长度,并在页面提交刷新后自动滚动到该位置。
实现思路:
使用jquery来操作dom,方便易用。
1、获取当前滚动过的距离;
2、在前后台之间传递;
3、在页面刷新后滚动到该位置。
代码:
1、获取当前滚动的距离:
2、在前后台传递参数:
以struts2+velocity为例。
需要实现这样一个流程:
前台在点击某条记录修改时获取当前滚动的距离x、y,将x、y传给后台,后台处理完成后继续跳转页面(在本需求中即为当前页面),将x、y作为参数传给目的页面。
form表单的action为/test/book/modify.action,对应的action类为BookAction.java。该类增加两个属性并设置相应的get、set方法:
首先配置该action的相关配置:
以上配置可知,当提交的action为/test/book/modify.action时,会进入BookAction.modify()方法,该方法返回值为"list4modify"。
然后触发list.action,在页面list.vm中需要处理滚动的动作。
3、在页面刷新后滚动到该位置:
在list.vm中编写如下逻辑即可:
已有 0人发表留言,猛击->> 这里<<-参与讨论
ITeye推荐
页面上的结果集列表有多条记录,选中某一行进行操作时,页面可能已经滚动过一段距离,当点击提交时希望能记录滚动过的长度,并在页面提交刷新后自动滚动到该位置。
实现思路:
使用jquery来操作dom,方便易用。
1、获取当前滚动过的距离;
2、在前后台之间传递;
3、在页面刷新后滚动到该位置。
代码:
1、获取当前滚动的距离:
var x = $(document).scrollLeft(); var y = $(document).scrollTop();
2、在前后台传递参数:
以struts2+velocity为例。
需要实现这样一个流程:
前台在点击某条记录修改时获取当前滚动的距离x、y,将x、y传给后台,后台处理完成后继续跳转页面(在本需求中即为当前页面),将x、y作为参数传给目的页面。
form表单的action为/test/book/modify.action,对应的action类为BookAction.java。该类增加两个属性并设置相应的get、set方法:
int scrollLeft=-1; int scrollTop=-1; public void setXxx(int value){ xxx = value; } public int getXxx(){ return xxx; }
首先配置该action的相关配置:
<package name="book" namespace="/test/book" extends="default"><action name="*" class="com.test.book.BookAction" method="{1}"><result>/WEB-INF/vm/test/book/{1}.vm</result><result name="list4modify" type="chain"><param name="actionName">list</param></result>
以上配置可知,当提交的action为/test/book/modify.action时,会进入BookAction.modify()方法,该方法返回值为"list4modify"。
public class BookAction{ ... public String modify(){ ... return "list4modify"; } }
然后触发list.action,在页面list.vm中需要处理滚动的动作。
3、在页面刷新后滚动到该位置:
在list.vm中编写如下逻辑即可:
$(document).ready(function() { var x = parseInt($!scrollX); var y = parseInt($!scrollY); if((x || y) && (x > 0 || y > 0)){ window.scroll(x,y); } }
已有 0人发表留言,猛击->> 这里<<-参与讨论
ITeye推荐