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

Question

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

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

Answer 1

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

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

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

Answer 2

使用带回调的模糊。 它没有经过测试。您想恢复其他模糊的右键单击功能吗？ 我认为这会更好地执行其他类型的活动。

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

Answer 3

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

您应该使用mouseout事件：

假设您的上下文菜单的ID为“contextMenuContainer”，则应覆盖它：

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

有关详情，请参阅jQuery Events/mouseout文档。

<强>更新

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