Question

我正在使用哈希来动态加载内容。为了使后退按钮工作，我正在捕获哈希变化。但是有时候我需要更改散列而不触发散列更改功能（例如，当页面被重定向到服务器端时，我需要在内容返回后更新散列。）

我提出的最佳解决方案是取消绑定hashchange事件，进行更改然后重新绑定它。但是，由于这是异步发生的，我发现它重新绑定太快并仍然捕获哈希值。

我目前的解决方案非常糟糕：重新绑定在setTimeout中。有没有人有更好的主意？

    $(window).unbind( 'hashchange', hashChanged);
    window.location.hash  = "!" + url;
    setTimeout(function(){
        $(window).bind( 'hashchange', hashChanged);
    }, 100);

编辑：
Amir Raminfar的建议促使我找到了一个不需要超时的解决方案。我添加了一个类变量

_ignoreHashChange = false;

当我想静默更改哈希时，我会这样做：

_ignoreHashChange = true;
window.location.hash  = "!" + url;

并且散列更改事件执行此操作：

function hashChanged(event){
    if(_ignoreHashChange === false){
        url = window.location.hash.slice(2);
        fetchContent(url);
    }
    _ignoreHashChange = false;
}

Answer 1

您可以使用history.replaceState并附加哈希值，以替换当前URI而不会触发hashchange事件：

var newHash = 'test';

history.replaceState(null, null, document.location.pathname + '#' + newHash);

JSFiddle example

Answer 2

你可以拥有这样的功能：

function updateHash(newHash){
  ...
  oldHash = newHash
}

然后在你的setTimeOut中你需要做

function(){
  if(oldHash != currenHash){
    updateHash(currenHash);
  }
}

所以现在你可以手动调用update hash，它不会被事件触发。您还可以在updateHash中使用更多参数来执行其他操作。

顺便问一下，你看过jquery历史插件了吗？ http://tkyk.github.com/jquery-history-plugin/

在不触发hashchange事件的情况下更改哈希

2 个答案: