在刷新期间保持滚动位置答案

【问题标题】：Keep scroll position during refresh在刷新期间保持滚动位置
【发布时间】：2011-07-31 18:42:18
【问题描述】：

我有一个显示房间列表并在那里显示状态的网络服务器。它每 30 秒刷新一次以收集新事件并显示房间的任何状态变化。

问题在于刷新率必须很快，以便实时注册事件，但每次页面刷新时用户都会移回列表顶部，这在可能有数百个房间时会出现问题。

服务器由 .jsp 文件组成，我认为这些文件是 javascript，因为它在页面顶部附近的 HTML 标记中显示 javascript。

我只使用过 javascript 作为 PHP 的插件，所以有点不确定。

有谁知道我可以存储用户的滚动位置并在页面刷新时将其重置在那里的方法。

谢谢

【问题讨论】：

*他们的。如果您使用的是 php+ajax，您可以加载数据而无需刷新页面。您可以发布任何代码/更多详细信息吗？
JSP 代表 JavaServer Pages，它不是 Javascript。这可能对您的搜索有所帮助。
@Calum 我没有使用 php。我正在增强别人的代码（以前的员工）并且不确定我在做什么，因为我只知道 php。

标签： javascript scroll

【解决方案1】：

现在您应该使用sessionStorage 而不是cookie。 cookie 将在选项卡之间共享（可能会非常混乱），而 sessionStorage 是选项卡独有的：

sessionStorage 和Window.localStorage 类似，唯一的区别是localStorage 中存储的数据没有设置过期时间，sessionStorage 中存储的数据会在页面会话结束时被清除。只要浏览器打开并在页面重新加载和恢复后仍然存在，页面会话就会持续。 在新标签页或新窗口中打开页面将导致启动新会话，这与会话 cookie 的工作方式不同。

【讨论】：

【解决方案2】：

您可以将 scrollTop 的值存储在 cookie 中，然后在 onload 上，将 scrollTop 设置回该值，但这可能会给用户带来生涩的体验。

您可能想尝试对新数据进行 XHR/Ajax 调用，然后将其附加到页面上的正确位置。

你最喜欢的 JS 库会让这很容易做到。

【讨论】：