有关 window.history.pushState 的帮助

Question

我需要语法方面的帮助。

我的网站使用 AJAX 在 #board div 中加载博客文章，然后单击 #close 将其关闭。当我加载帖子时，网址变成这样 http://www.visualise.ca/ #!/anne-au-cherry 我想回到 http://www.visualise。 ca/ 当我关闭帖子时。以下给了我 http://www.visualise.ca/#/

$("#close").live("click", function(event) {
    $("#board").slideUp("slow");
    window.location.hash = "#/";
    window.history.pushState(null,null,site_url+"/");
    return false;
});

1）有人可以帮忙吗？

2）如果浏览器不支持html5怎么办？

非常感谢您的时间和帮助。

更新：这有效，我的“site_url”变量中有一个拼写错误。

Answer 1

PushState 不是对哈希的操作。如果你希望它是 < html5兼容你需要使用hash。

PushState 正在更改 url 而不更改页面：

如果您将历史记录视为数组，history = [];

您打开浏览器的空首页并转到 page1.html

现在历史记录 = [ 'page1.html']。

如果您使用 URL page2.html 从 page1.html 触发 PushState，历史记录现在为 ['page1.html','page2.html'] 并且地址栏显示 page2.html。

如果浏览器不支持pushState，它什么也不做。因此，对于您的示例：

$("#close").live("click", function(event) {
    $("#board").slideUp("slow");
    window.history.pushState(null, null, site_url+"/");
    return false;
});

当您加载 ajax 时：

window.history.pushState(null,null,site_url + "/" + ajax_url);

---

如果您想使用哈希进行操作，您可以执行以下操作：

$("#close").live("click", function(event) {
    $("#board").slideUp("slow");
    window.location.href = "#/"
    return false;
});

当您加载 ajax 时：

window.location.href = "#/" + ajax_url

如果您使用 PushState 请注意 url 可能会结束指向您的子文件夹中的操作没有，因此您需要某种 .htaccess 重写代码