使用JavaScript在请求之间传递单次使用值的最佳方法

Question

我需要通过JS触发页面重新加载，保留垂直滚动位置。

我正在使用another SO question中描述的解决方案：

1. 计算当前滚动位置
2. 将当前位置添加为查询字符串参数，然后重定向
3. 当页面重新加载时，请从查询字符串＆amp;中读取值。调整滚动位置

但是，我只想恢复第一次重定向的滚动位置。如果用户滚动页面然后使用Ctrl-R触发手动重新加载，我不想重新滚动到该保存的位置。

是否有某种方法可以使用ONLY JavaScript传递一次性，可见到下一个请求的值？或者从document.location.href 中移除值而不使用重定向？

我是否应该使用HTML 5历史记录API在消费后清除位置值？

Answer 1

将值保存到sessionStorage。使用后，删除该值，以便在手动刷新时无法读取。

sessionStorage.setItem("scroll_position", "300");
sessionStorage.getItem("scroll_position"); // 300
sessionStorage.removeItem("scroll_position");

sessionStorage is really well-supported - 它将适用于IE8 +其他浏览器的任何相关版本。

---

StackOverflow通过在URL哈希中存储post id来处理页面后加载滚动。你也可以这样做。

网址stackoverflow.com/...../21485393#21485393的＃21485393与锚元素<a name="21485393"></a>匹配。页面加载后会自动滚动到该元素。

你也可以这样做。

http://your.url.com/page#300

使用

检索它

window.location.hash

完成

后删除它

window.location.hash = ""