页面滚动条刷新后保持在原来的位置

最新推荐文章于 2021-06-03 15:18:06 发布

BlomerGuo

最新推荐文章于 2021-06-03 15:18:06 发布

阅读量2.7k

点赞数

CC 4.0 BY-SA版权

分类专栏：笔记文章标签： jsp html jquery

本文链接：https://blog.youkuaiyun.com/blomer/article/details/50984114

笔记专栏收录该内容

14 篇文章

订阅专栏

本文介绍了在jsp页面中，如何实现在页面刷新后滚动条仍保持在用户之前浏览的位置。主要涉及HTML、jQuery等相关技术，通过记录滚动条位置并在页面加载后恢复，确保用户体验的连续性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

场景：上图两个jsp页面

prOJECTYEARPLANSUMMARYList.jsp

prOJECTYEARPLANSUMMARYSelectListNoPage.jsp

list.jsp

里面有个iframe <iframe name="result" id="result" scrolling="yes" width="100%" height="100%" src="" frameborder=0></iframe>

包含 selectListNoPage.jsp的 >>>滚动条是在 nopage.jsp页面上

操作：当修改记录表中的一条记录后要保持滚动条在原来那个位置上

在点击修改的时候先把nopage.jsp的滚动条的位置（currScrollTop）获取，传到后台，

修改好后刷新nopage.jsp 并把把这个currScrollTop传到nopage.jsp的父页面 List.jsp

然后在selectListNoPage.jsp中如下写：

$(function (){
var nScrollHight = 0; //滚动距离总长(注意不是滚动条的长度)
var nScrollTop = parent.currScrollTop; //滚动到的当前位置
var nDivHight = $("#contentDiv").height();
var top11 = parent.nScrollTop;
$("#contentDiv").scroll(function(){
nScrollHight = $(this)[0].scrollHeight;
nScrollTop = $(this)[0].scrollTop;
if(nScrollTop + nDivHight >= nScrollHight){
}
});
$("#contentDiv").scrollTop(nScrollTop);
});