如何在指定元素之外發生點擊時執行操作

我想設置一個系統，以便當用戶點擊時，如果該點擊不是源於指定的div內，則應該觸發一個函數與該div的東西。基本上更多的時候，當用戶點擊一個div的外部我想隱藏它，但問題是，我有幾個元素，我想這樣做，所以event.stopPropagation不能很好地工作。如何在指定元素之外發生點擊時執行操作

document.onclick = function (e) { 
e = !e ? window.event.srcElement : e.target; 

if ($('#toppanel div#panel').not(e.id).is(':visible')) { $('.dashboardNav .addWidget').click(); } 
if ($('#TrackRibbon').not(e.id).is(':visible')) { $('.dashboardNav #openRibbon').click(); } 
if ($('.subnav').not(e.id).is(':visible')) { $('.subnav').hide(); } 
}

但是這並不工作，因爲我想要麼是，它確實有點，但我的頁面上有多個.subnav以及與此，你可以把它們全部打開沒有其他人關閉。

關於如何完成這樣一個目標的任何想法將不勝感激，也如果我沒有解釋得好，只是讓我知道。

來源

2011-12-02 Zholen

你使用jQuery嗎？你似乎是，但沒有標記這樣的問題，如果你使用jQuery，爲什麼不用它來設置你的事件處理程序？ – nnnnnn

我正在使用jquery，並且在添加標籤時不小心碰到了輸入，並且沒有添加該標籤。我不知道如何設置處理器 – Zholen

所以這就是我設法完成大部分我想要的。我想通過一些調整，它會很好。

$(document).click(function (e) { 

     var closables = ["#TrackRibbon", '#toppanel', '.subnav', '#Mailbox']; 

     var toggles = ['#openRibbon', '.addWidget', '.topnav > li', '#MailboxToggle']; 

     var skip = -1; 
     e = !e ? window.event.srcElement : e.target; 

     for (var j = 0; j < toggles.length; j++) { 
      if ($(e).parent(toggles[j]).length > 0 || $(e).is(toggles[j])) { 
       skip = j; continue; 
      } 
     } 

     for (var k = 0; k < closables.length; k++) { 
      $(closables[k]).each(function (i) { 
       if (skip !== k) { 
        if ($(this).has($(e)).length === 0 && $(this).is(':visible')) { 
         $(this).hide(); 
        } 
       } 
      }); 
     } 
    });

唯一不能正常工作的部分是'.subnav'，它可能有很多。所以如果有人有任何改進的建議讓我知道。

來源

2011-12-06 22:19:55 Zholen

會這樣的工作？

$(document).bind('click', function(e) { 
    if($(e.target).hasClass('dontTriggerThisFunction')) { return; } 

    doTheStuffWeWantToDo(); 
});

來源

2011-12-02 03:59:38

只適用於非動態添加項目，但我認爲這可能是他可以做的最好 –

@Adam Rackis - 這應該也適用於動態添加項目。 – nnnnnn

@nnnn - 我誤讀 - 你是對的。 –

如何在指定元素之外發生點擊時執行操作

回答

相關問題