在 jquery 的 onblur 事件中隐藏上下文菜单答案

【问题标题】：hiding the context menu at onblur event in jquery在 jquery 的 onblur 事件中隐藏上下文菜单
【发布时间】：2009-09-20 13:58:41
【问题描述】：

是否有人尝试在blur 事件中成功隐藏上下文菜单？我想要做的是当鼠标不在上下文菜单div内时隐藏自定义的右键菜单。

这使用 jquery 上下文菜单插件。

【问题讨论】：

【解决方案1】：

如果您想知道焦点何时离开容器区域，但容器内的子控件不触发事件，请使用mouseleave。

$('#menu').on('mouseleave', function(){
  $(this).hide();
});

mouseout 或blur 不是您在这种情况下需要的，因为它们会在容器内的任何子控件接收到鼠标焦点时触发，从而导致包含它们的菜单隐藏。

【讨论】：

【解决方案2】：

将模糊与回调一起使用。虽然它没有经过测试。你想恢复其他模糊的右键功能吗？我认为这在其他类型的事件上会更好地执行。

$("input").blur(function () {
     window.oncontextmenu = function () {
        return false;
     }
});

【讨论】：

虽然我意识到他实际上是在要求“onblur”，但他所描述的并不是真正的模糊事件。
@Elzo 提出问题的人不应该被否决，因为他们对自己的问题没有完全理解。如果他们这样做了，他们可能一开始就不需要问问题。但是，给出错误信息的答案是不同的。我投了反对票，因为我觉得这个答案是错误的，并且显然没有付出太多努力来实际阅读这个问题（只有标题）
这不是激励我给出更好答案的方法。认为我们并非都是以英语为母语的人，上下文菜单可能是一个误导性的概念。我现在明白他想要什么了。
这个插件的自定义上下文菜单没有容器？

【解决方案3】：

您明确提到了blur 事件，但我认为这实际上不是您需要的，因为您提到的上下文菜单div 可能永远不会被聚焦或模糊。

你应该使用 mouseout 事件：

假设您的上下文菜单的 id 为“contextMenuContainer”，这应该覆盖它：

$('#contextMenuContainer').mouseout(function() {
    $(this).hide();
});

有关更多信息，请参阅jQuery Events/mouseout 文档。

更新：

我尝试在您链接到的插件页面上注册一个 mouseout 事件处理程序，它触发得很好。我应该注意，每次更改菜单项时都会触发它，因此您需要检查事件目标以确保鼠标实际上已退出整个菜单。

【讨论】：

我尝试使用 mouseout 但似乎没有触发事件。可能出了什么问题？
可能是在 mouseout 时触发了其他一些事件，并且事件处理程序阻止了该事件的传播。您能否更具体地了解您使用的是哪个插件？我可以找到多个“jquery 上下文菜单插件”。
我正在使用来自此链接的插件。 trendskitchens.co.nz/jquery/contextmenu如何解决事件传播？
mouseout 的行为是#contextMenuContainer 的任何子元素的任何鼠标焦点都会触发mouseout，这不适用于上下文菜单。另一个答案 mouseleave 效果更好。