Question

也许我只是累了，但我有一个右键菜单，当用户点击菜单以外的任何地方时我要关闭它。但是，当用户点击其他内容时，我无法弄清楚如何让它消失。

以下是显示菜单的代码：

// If mouse click on was pressed
$('#content_list table tr').bind('mouseup', function(event) {
    // if right click
    if(event.which == 3) {
        showRightClickMenu(event);
    }
    event.preventDefault();
    event.stopPropagation();
});

这就是我隐藏菜单所得到的

// If mouse click outside document
$(document).bind('blur', function(event) {
    hideRightClickMenu();
    event.stopPropagation();
});

// If mouse click not on the menu
$('*:not(#rightClickMenu *)').bind('mousedown keydown', function(event) {
    hideRightClickMenu();
    event.stopPropagation();
});

第一个bind检查用户是否在文档外部单击，第二个bind检查用户是否单击除菜单之外的所有内容。但第二个并不真正奏效。如果我点击菜单，菜单就会被隐藏。

不应该这么辛苦...任何人有任何想法吗？

Answer 1

以这种方式试试

$(document.body).bind('click', function() {
    hideRightClickMenu();
});

$(window).bind('blur', function() {
    hideRightClickMenu();
});

Answer 2

尝试使用focusout()事件并使用on()代替旧版bind()。这将适用于多个子菜单。 http://jsfiddle.net/elclanrs/jhaF3/1/

// Something like this...
$('#menu li').on('click', function() {
    $(this).find('ul').show();
}).find('ul').on('focusout', function(){
    $(this).hide();
});

不单击元素时单击事件

2 个答案: