如何操作浏览器历史记录并捕获浏览器后退/前进按钮？

Question

我一直在寻找几个小时试图做一个简单的浏览器历史操作。

我有几个菜单链接，我绑定单击处理他们。链接'href的只是哈希：href="#Home"或href="#About"。

我想，当用户点击链接以显示子页面，而无需重新加载页面，并更改浏览器的URL。

我也试过用pushState的（这个基本的例子），但它不工作： http://jsbin.com/wecubizovu/1/edit?html,js,console

http://jsbin.com/wecubizovu

当我在Chrome运行此，我想到的是，如果用户点击链接，他将#asd追加到url并且popstate不会更改。为什么popstate被触发？我该如何做到这一点，以便当用户点击链接时，我将哈希追加到浏览器网址，当用户点击浏览器后退按钮时，我捕捉到该事件并显示我想要的页面？

谢谢！

Answer 1

您的a元素有href的''如果您不阻止默认操作，并且这会以某种方式混淆您想要执行的操作，它仍会执行。 改变你的函数

$("#asd").click(function(e) { 
    e.preventDefault(); 
    alert("jo"); 
    window.history.pushState("", document.title, "#asd"); 
}); 

实现你在找什么。

编辑：链接：http://jsbin.com/sosozeteti

http://jsbin.com/sosozeteti/1/edit?html,js