如何确保绑定到hashChange事件不会冒泡?

5

我希望阻止hashChange事件的冒泡。

我有以下代码:

$(window).bind('hashchange', function( e ) {
    console.log("hash fired");
    // run hashChange routine
    });
我的脚本管理页面上的面板,每个面板都有自己的历史记录堆栈。上述内容会在每次转换时触发,但我会阻止向前转换的hashChange,以便我可以深入浏览面板。在向后“转换”时,只有hashChange被触发且不被阻止,所以我可以返回上一页。 导航可能如下所示:
panel A, start down > page2
panel A, page2 down > page3
panel A, page3 up > page2
panel A, page2 up > start - hashChange fires twice here... 
一切工作正常(= hashChange只触发一次),直到我到达初始设置之前的页面。在最后一步骤中,上述hashChange绑定会触发两次。我已经尝试永远设置一个标志来阻止第二个hashChange,但它并没有像我希望的那样工作。 问题:如何确保这不会冒泡?我正在尝试类似于以下内容的东西,但它不起作用:
var $blockBubblingHashes = 0;
$(window).bind('hashchange', function( e ) {       
   if ($blockBubblingHashes == 0) {
      // run hashChange routine
      $blockBubblingHashes = 1; 
      } else {
         $blockBubblingHashes = 0;
         }
    });
1个回答

3
如果你希望事件处理程序仅触发一次,应考虑使用 one() 函数,在第一次执行后会删除处理程序。
$(window).one('hashchange', function( e ) {    
    console.log("hash fired");
    // run hashChange routine
});
如果您想要停止事件冒泡,而不是删除处理程序,您应该检查事件对象上的stopPropagation()stopImmediatePropagation()方法。不幸的是,我认为您将所有hashchange处理程序绑定到window,而jQuery没有记录绑定到同一元素的事件处理程序的执行顺序;因此,您将无法可靠地知道哪个处理程序首先被调用。

如果你将所有的hashchange绑定到window上,你必须使用stopImmediatePropagation(),但是"jQuery没有记录绑定到同一元素的事件处理程序的执行顺序;因此你无法可靠地知道哪个处理程序首先被调用。" - Matt
尝试绑定到one()和both "propgrations",所有结果都只会在触发单个事件后变得静默。这并没有帮助。因为我需要它在“每次hashChange”时触发一次。 - frequent
@frequent:我不太确定你想要什么,希望有人能帮助你 :)。 - Matt
好的,谢谢你指引我一些新的方向。我会想出解决方案的。 - frequent
找到了。我的转换函数中出现了一个错误,触发了另一个hashChange事件。我给你们答案,因为你们所有的观点都是正确的。再次感谢。 - frequent

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,