在浏览器刷新时保留活动内容答案

【问题标题】：retain active content upon browser refresh在浏览器刷新时保留活动内容
【发布时间】：2016-12-08 20:53:22
【问题描述】：

所以，我有一个正在使用 javascript/jquery 开发的网站。它的作用类似于手风琴，但适用于整个站点。链接位于屏幕左侧，当您单击一个（比如说“关于我”）时，当前内容（可能是“主页”或“联系人” ”页面）滑出屏幕，“关于我”的内容滑出屏幕。我的问题出在刷新页面时。

如果正在查看“关于我”或“联系人”内容并且您单击刷新，它会重置并显示“主页”页面内容。我希望当前内容（如果与“主页”内容不同）在页面刷新时保持可见。

关于如何完成此任务的任何建议？我一直在玩“hashchange”事件/函数，可以让我的 URL 更新，但我仍然需要刷新来加载当前内容，而不是每次都加载主页内容。

感谢您的帮助！

【问题讨论】：

要么使用 cookie 或 localstorage，这样它甚至可以在会话之间保持不变，或者你只需刷新 example.com/page#contact 之类的内容，然后检查并根据 url 加载内容。
你能给出一些代码示例吗？
codepen.io/Aunnix/pen/KNROax 这是当前代码。
我会检查本地存储..

【解决方案1】：

即使浏览器刷新，也有几种方法可以保留内容：

1- 网址参数。在这种情况下，您可以在 url 上添加当前选定的菜单，例如：

localhost?currentMenu=about

不这样做时，您必须有一个脚本来检查并选择相应的菜单onLoad。

2- 本地存储

localStorage.setItem('currentMenu', 'about');

然后在onLoad上检查一下：

currentMenu = localStorage.setItem('testObject');

3- 饼干

document.cookie = "currentMenu=about";

请记住，所有这些选项都需要对负载进行额外检查。

【讨论】：