javascript - 单击浏览器后退按钮时将用户返回到他们在上一页上滚动到的位置

标签 javascript jquery browser back-button

在浏览器中按下后退按钮时,是否可以将用户带回到他们向下滚动到的页面区域?如 --- pageA 是屏幕尺寸的两倍(因此您必须滚动才能阅读更多内容)。您单击 pageA 上的链接转到新页面 - pageB。阅读后点击浏览器返回。现在,当您返回页面 A 时,您又回到了顶部,必须向下滚动到您要继续阅读页面其余部分的位置。

有没有Jquery或者JS的方式返回到页面中的那个点。也许与 .scrollTop() 有关?

最佳答案

如果内容在页面“加载”事件触发后加载,则后退按钮不会将您带回到原来的位置。因为浏览器在“加载”事件之前滚动。

在这种情况下,为了让浏览器记住滚动位置,您必须在导航离开之前将滚动位置和状态(已加载的内容)存储在某个地方。在 cookie 中或在 url 哈希中。

如果 pageA 只是一个没有动态内容的静态页面(在 'load' 事件后加载,当你返回时浏览器应该记住滚动位置。

对于动态内容,至少包括两部分。一种是在单击“后退”按钮时恢复页面状态,因此加载所有动态内容,展开或折叠一些扩展器。另一个是滚动到那里。

第一部分取决于页面的实现方式。第二部分你可以在页面执行 onUnload 时将滚动顶部放入 cookie 中。例如

$(window).unload(function() {$.cookie('scrollTop',$(window).scrollTop());});

关于javascript - 单击浏览器后退按钮时将用户返回到他们在上一页上滚动到的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25168861/

相关文章:

javascript - empty().append() 元素后的 Click 事件松散目标

javascript - 如何更模块化地编写 jQuery 代码?

ajax - ajax settimeout刷新div

browser - Win10如何在Wi-Fi热点连接上禁用自动打开浏览器?

html - WebSockets 与服务器发送的事件/事件源

javascript - callback && callback() 在 javascript 中是什么意思

javascript - 使用 jQuery 获取父级 div 文本

javascript - 在 Canvas 标签中移动和清除线条

javascript - 带有切换 div 显示/隐藏的列表

javascript - Foreach 验证基于 foreach 列表中的最后一个输入进行验证