0

关于 HTML5 的功能有几个问题pushState,但我无法找到关于我遇到的两个问题的任何信息。我的popstate处理程序定义如下:

$(window).bind('popstate', function (e) {
    if (!e.originalEvent.state)
        return;

    LoadContent({ url: e.originalEvent.state.path });
}

LoadContent调用只是使用 ajax 填充内容窗格。

问题 1:假设我们从page1我的网站开始浏览它。LoadContent不会被调用,因为没有state. 假设我的浏览历史是这样的:

page1 -> (ajax)page2 -> (ajax)page3 -> (back pressed)page2 -> (back pressed)page1

当我按下浏览器的后退按钮转到 时page2,一切都很好。但是,当我再次按下返回时,应该加载的内容为null page1这意味着不会调用 LoadContent ,因此内容将保持与 on 相同。按下返回时如何获取要加载的内容?e.originalEvent.statepage2page1

问题 2:假设我们按下 from page3to page2,这意味着我们通过 ajax 加载第二页的内容。现在想象一下,我们再次浏览(即手动将 URL 输入到浏览器的地址栏中)到page3然后再次按返回转到page2. 浏览器不会显示第二页,而是仅显示我们之前检索到的's 内容的ajax 结果page2,因此不会加载页面的其余部分。如何解决这个问题?

谢谢你的帮助!

4

2 回答 2

0

对于您的问题1:

您需要重新加载整个页面或通过 ajax 将其加载回来,因为初始页面中的数据不会被推送到历史记录。或者您可以更改页面加载事件以从 ajax 加载数据并动态加载内容,然后您将拥有需要推送到历史记录的必要 json 数据。

于 2013-08-10T13:00:04.530 回答
0

我刚刚遇到了与您的问题 2相同的问题。

您可以发送 HTTP 标头以防止 Web 浏览器缓存和显示 XHR 内容。在执行 History 对象 JS 的页面上执行此操作。

在 PHP 中:

header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
于 2016-03-08T10:22:56.303 回答