如何添加浏览器历史状态？答案

【问题标题】：How do I add a browser history state?如何添加浏览器历史状态？
【发布时间】：2011-04-07 17:37:18
【问题描述】：

所以我看到很多人推荐隐藏的iFrame hack，即jQuery history plugin，但我真正需要的是这种技术的另一半：

function whenItemIsClicked()
    {
    window.location.hash = this.id;
    //some other stuff, like Ajax
    }

//and then, if page is reloaded...
$(document).ready(function(){
    var loc = window.location.hash;
    //if there happens to be a hash, navigate to corresponding content
    if(loc != '') $(loc).click();
});

这两个都很好用。现在，我想附上这两行

  var loc = window.location.hash;
  if(loc != '') $(loc).click();

到一个事件，但似乎没有一个会被后退按钮一致触发。有没有办法添加浏览器历史状态来保存当前 URL，以便上述技术有效？

【问题讨论】：

标签： javascript jquery hashchange browser-state

【解决方案1】：

有一个名为window.onhashchange 的事件虽然不是每个人都支持它，但是...there's a plugin by Ben Alman 来解决这个问题。

该插件通过使用window.onhashchange（本机事件）使其跨浏览器工作（如果它存在）。如果没有，它会每 50 毫秒轮询一次，并在哈希发生变化时触发事件本身。使用the plugin，您的代码将如下所示：

$(window).hashchange(function() {
  var loc = window.location.hash;
  if(loc != '') $(loc).click();    
});

您只需将代码放在一个地方即可。你可以在document.ready触发一次

$(function(){
  $(window).hashchange();
});

【讨论】：