0

我有一个 HTML5 应用程序,它操纵浏览器历史记录以显示 Ajax 调用的正确 URL。这很好用,但是当我的应用程序具有指向外部站点的超链接时会出现问题,例如http://www.google.com。发生这种情况时,历史记录如下所示:

我的应用页面 A -> 我的应用页面 B -> Google

当用户点击一次后退按钮时,一切都很好。显示了我的应用页面 B。

但是当用户第二次点击后退按钮时,URL 会改变,但页面不会改变。我的应用程序无法进行正确的 Ajax 调用来显示我的应用程序页面 A 的状态,因为从未调用过 onpopstate 处理程序。这是因为当浏览器返回“我的应用程序页面 B”时,处理程序未初始化(该返回事件没有触发任何事件,因此我无法重新初始化处理程序。)

这种体验适用于 Chrome,但我没有理由相信它是 Chrome 特有的。有没有办法解决这个问题?

我知道像 Gmail 这样的应用程序会在新窗口中打开所有外部超链接。但是我的应用程序的要求不允许我这样做。

4

2 回答 2

2

@Pumbaa80 提供的链接让我走上了正确答案的轨道。

如果你放在<body onunload="">你的页面上,那么就会破坏 Chrome 和其他浏览器上的 bfcache。这意味着当您单击返回按钮从 Google 返回到“我的应用程序页面 B”时,所有页面状态 JavaScript 事件都会触发。

从谷歌回来后,没有办法让 onpopstate 在我的应用页面 B 上被调用。(这不合逻辑,因为该事件仅在您点击后退按钮的页面上触发。)

另一种方法是在 My App Page B 加载时执行逻辑。通过如上所述破坏 bfcache,jQuery dom ready 将触发。通过在 jQuery dom 就绪回调中运行来自 onpopstate 的类似代码,我可以访问存储在 History 对象中的数据,从而在从外部页面返回后重置我的 HTML5 Web 应用程序的状态。

于 2012-06-24T17:18:06.073 回答
0

我认为您需要使用哈希标签来保存页面的状态,我看不出有什么办法。过去我使用这个 jQuery 插件取得了巨大的成功,它的名字非常流行,名为BBQ(Back Button & Query library)。这将允许您的页面根据 URL 中的哈希标签执行操作。

于 2012-06-16T19:54:31.363 回答