Question

自ubuntu和Windows上的v65版本以来，Firefox的某些事件绑定行为异常。使用Jquery的“ on”功能添加自定义上下文菜单。触发上下文菜单后，将单击事件附加到主体以在发生左键单击时将其关闭。在chrome和v65之前的版本中都可以使用chrome。现在，如果我单击右键，上下文菜单将立即打开和关闭。

我分析了几次Firefox更改日志，但没有发现任何可能导致此行为的更改。

有更改日志： https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/65

重现该问题的最小代码：

var container = $(".container")
var contextMenu = $(".contextmenu")

$(document).on("contextmenu", (function(e) {
    e.preventDefault();

    if ($(e.target).is(container)) {
        contextMenu.show();

        $(document).off("click.contextTest");
        $(document).on("click.contextTest", (function(e) {
            if(!$(e.target).is(contextMenu)) {
                contextMenu.hide();
            }
        }));
    }
}));

$(document).on("click.contextMenuItem", '.context-menu-item', (function(e)     {
  alert('button clicked');
}));

https://jsfiddle.net/Lcakpjev/1/

“ mousedown”示例： https://jsfiddle.net/Lcakpjev/2/

'mouseup'的行为与'click'相同。

在框内单击鼠标右键以显示“上下文菜单”，然后在“上下文菜单”框以外的任何位置单击鼠标左键以将其隐藏。

在Chrome中，该示例运行良好，但在v65以上的Firefox中，上下文菜单仅闪烁一个。较旧的Firefox也可以正常工作。

Answer 1

我可以在macOS的FF67中确认此行为。但是我已经安装了FF64，但仍然可以确认。可能与这个已有17年历史的错误有关：https://bugzilla.mozilla.org/show_bug.cgi?id=184051（是通过这样的问题Firefox fires click event at the same time with contextmenu event找到的）

作为一种解决方法，我将使用'mousedown'而不是'click'-经过测试，似乎可以正常工作。

注1：请不要忘记在每个“ contextmenu”事件上都设置了“ click”处理程序，但永远不要删除它-因此，在触发器div中每次单击鼠标右键都会增加事件处理程序的数量。

注2：您正在使用this.selector，我相信它不存在。

注意3：如何检测外部点击Use jQuery to hide a DIV when the user clicks outside of it

if(!contextMenu.is(e.target) && contextMenu.has(e.target).length === 0) {
  contextMenu.hide();
}

还有一个带有以下代码的小提琴：https://jsfiddle.net/r4o17fjz/

自Firefox v65起，jQuery事件绑定的行为有所不同

1 个答案: