Firefox奇怪的右击事件冒泡行为

Firefox strange right click event bubbling behavior

本文关键字:事件 右击 Firefox      更新时间:2023-09-26

我在firefox中遇到一个奇怪的问题,当右键单击子节点时,会在文档节点上引发单击事件

下面的代码说明了这个问题:http://jsfiddle.net/RyDZU/5/

更新版本:http://jsfiddle.net/RyDZU/10/

$(document).on("click","span",function(e) {
    console.log('span');
    console.log(e.isPropagationStopped());
});
$(document).on("click","div",function(e) {
    console.log('div');
    console.log(e.isPropagationStopped());
    e.stopPropagation();
    console.log(e.isPropagationStopped());
});
$(document).on("click",function(e) {
    console.log('body');
    console.log(e.isPropagationStopped());
});

HTML:& lt;div> & lt; span>Test & lt;/div>

如果您右键单击单词"test",则在firefox(21)的控制台中打印单词"body"。不支持ie10/Chrome。

如何防止在Firefox中引发此事件?

这行不通:

$("body").on("click", "span", function(e) {
    e.preventDefault();
    e.stopPropagation();
});

我遇到了同样的问题。我有一个小提琴,如果你在绿色的正方形左键单击事件是由两个handler2(在div)和handler3(在文档)处理。但是,如果右击,只调用handler3,这意味着没有一种简单的方法可以在右击div时停止传播。

jsfiddle

// requisite jsfiddle code snippet
function handler2() {
    console.log('in handler2');
}
function handler3() {
    console.log('in handler3');
}
$(document).ready(function () {
    $('#block2').on('click', handler2);
    $(document).on('click', handler3);
});

我也试着玩设置dom.event.contextmenu.enabled和services.sync.prefs.sync.dom.event.contextmenu。

这可以通过使用event.which来检查哪个鼠标按钮被按下(从附加到文档的事件侦听器)来修复。参见https://stackoverflow.com/a/12430795/1170489。

Make

$(document).on("click",function(e) {
    console.log('body');
    console.log(e.isPropagationStopped());
});

脚本中的第一个处理程序。当您按照自己的方式操作时,文档单击处理程序会隐藏span和div处理程序。