如何在现代 Web 应用程序中导航答案

【问题标题】：How to navigate back in a modern web app如何在现代 Web 应用程序中导航
【发布时间】：2012-11-19 10:39:33
【问题描述】：

我最近看到一些网络应用程序通过单击按钮来更改页面的内容和有效状态。然后他们有链接可以导航到应用程序的另一部分。有时我想通过按浏览器的后退按钮返回，我希望页面处于我离开时的状态。但是我经常看到我第一次进入那个页面时的内容。

在现代网络应用程序中构建导航的好方法是什么，以便后退按钮返回页面的上一个（最后一个）状态。

【问题讨论】：

那么你的问题是什么？您是在询问有关框架/插件或完整设计的提示吗？

标签： javascript web-applications

【解决方案1】：

这篇文章可能有一些答案。它详细介绍了如何使用 HTML5 的 pushState 和 popState 在使用前进/后退时维护 Web 应用程序中的状态，而无需完全刷新页面。

http://diveintohtml5.info/history.html

【讨论】：

【解决方案2】：

我不确定您所说的“现代”是什么意思，但您可能希望查看此讨论 here（关于如何控制浏览器历史记录的操作以及为什么 [有时它不是邪恶的]），并查看 @ 987654322@ jQuery 插件（用于hashable 历史和状态）。

对于相关的 SO 问题：check this

【讨论】：

【解决方案3】：

我想您指的是由 AJAX 提供支持的动态单页应用程序。

您可以使用 history 对象的新 PushState() 和 replaceState() 方法，大多数现代浏览器都支持这些方法（ inc. IE10)，并允许您在不触发页面刷新的情况下操作浏览器的历史记录。这允许您将对象附加到状态，一旦触发 onpopstate 事件，即当用户在浏览器中按下后退或前进时，您就可以使用该状态。

一旦传递了对象，您就可以相应地操作页面。例如您可以为帖子传递一个唯一 ID，然后使用 AJAX 加载它。

您可以在Mozilla Developer Network阅读更多相关信息

【讨论】：