不單擊元素時的單擊事件

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();
});

第一個綁定檢查用戶是否在文檔外部單擊，第二個綁定檢查用戶是否單擊除菜單之外的所有內容。 但是第二個並沒有真正起作用。 如果單擊菜單，菜單將被隱藏。

不應該那么辛苦imo ...任何人有任何想法嗎？

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();
});