如何使用Jquery編寫“如果未單擊”或“如果在外部元素上單擊”？

Question

我有點卡住了一個問題，即如何停止我的菜單執行fadeOut（）函數。 當我單擊菜單上的主鏈接以打開子菜單時，它會逐漸消失。 現在的代碼如下：

    $('a.main-menu-item').click(function(){

    if($('.rtmenu:visible')){

        $('.rtmenu').click(function(e) { e.stopPropagation(); });

        $(document).click(function() {
            $('.rtmenu').fadeOut(200);
        });
    }
})

誰能告訴我如何在顯示“文檔”的地方寫上“如果未單擊a.main-menu-item”？

非常感激

---

找到解決方案！

$('.rtmenu').click(function(e) { e.stopPropagation(); });
$('.rtmenu').mouseout(function(){ 
     $(document).one('click',function() { $('.rtmenu').fadeOut(200); }); 
 })

Answer 1

看看Ben Alman的“外部事件”插件 。 它允許您定義一系列事件，而不僅僅是單擊事件。 有了它，您的代碼將如下所示：

$('.rtmenu').bind('clickoutside', function() {
    $(this).fadeOut(200);
});

順便說一句，您不應該在菜單的click事件中設置綁定，這將在每次單擊菜單選項時附加另一個處理程序。 您的代碼應替換為：

$('a.main-menu-item').click(function(){
    // Show menu item
});
$('.rtmenu').bind('clickoutside', function() {
    $(this).fadeOut(200);
});

Answer 2

使用模糊事件來處理失去焦點。 這也可能會有所幫助。