以編程方式更新 hash 時禁用 hashchange 監聽器（jQuery BBQ）

Question

為了防止在設置 URL hash (#) 時出現反饋循環（與手動更改 URL 不同），我想暫時禁用 hashChange 監聽器。

使用$.bbq.pushState(hash)更新 hash 時，我應該如何更改此代碼以實際禁用 hashchange 事件？ （下面的代碼不起作用）

hashChangeEnabled : true,

bindHashChange : function(){
        var that = this;

        $(window).bind( 'hashchange', function( event ) {
            if(that.hashChangeEnabled == true){
                stateObj = event.getState() 
                that.stateChangedHandler(stateObj);
            }
        });

    },



updateURL : function(hash){
        this.hashChangeEnabled = false; // <--- Look here 
        $.bbq.pushState(hash);
        this.hashChangeEnabled = true;
    }, 

Answer 1

當事件處理程序中的代碼執行時，hashchange 事件異步觸發，hashChangeEnabled 已重置為 true。 您應該在 hashchange 事件中重置 hashChangeEnabled：

if(that.hashChangeEnabled == true){
  stateObj = event.getState() 
  that.stateChangedHandler(stateObj);
}
else {
  that.hashChangeEnabled = true;
}

在您的 updateURL function 中，您可以檢查 hash 是否已更改：

if (hash !== $.param.fragment()) {
  this.hashChangeEnabled = false;
  $.bbq.pushState(hash);
}

或使用 setTimeout 重置 hashChangeEnabled（等待 hashchange 事件觸發，如果 hash 發生變化）

this.hashChangeEnabled = false;
$.bbq.pushState(hash);
setTimeout(function() { this.hashChangeEnabled = true; }, 500);