JavaScript - 如果點擊某個按鈕之外的某個按鈕時如何運行某個功能？

Question

我有一個菜單，當單擊按鈕時，我想要顯示/切換，當點擊除按鈕之外的某個文檔部分時，隱藏該菜單。我一直在試圖一對夫婦的事情，你可以在這裏看到：

// $('.dropdown-toggle').click(function() 
// { 
    // $('.dropdown-menu').show(); 
// }); 
$(document).click(function() 
{ 
    // if ($(this).hasClass('dropdown-toggle')) 
     // $('.dropdown-menu').toggle(); 
    if ($(this).not('[dropdown-toggle]')) 
     $('.dropdown-menu').toggle(); 
}); 

如果我取消了頂部，當某種原因除了按鈕被點擊，贏得了文檔的一部分菜單將切換」當按鈕被點擊時不做任何事情。如果我保留該部分的註釋並取消註釋第一個if語句（即使我用'show'替換'toggle'），則無論文檔的哪個部分點擊，該按鈕都會切換。

編輯：我解決了部分問題。它看起來像我取消註釋的頂部（下拉切換類的點擊監聽器）時，菜單顯示，然後立即切換，因此它隱藏。如果我將「顯示」更改爲「隱藏」，我會這樣做，以便菜單顯示單擊按鈕時是否顯示，否則將切換。但是，我想做的事情與此相反。我想在單擊按鈕時切換，並且只在單擊文檔的其他部分時隱藏。看起來「hasClass（）」和「.not（[]）」沒有認識到下拉切換是被點擊的事物的類。

Answer 1

致電.toggle()在click處理程序鏈接到$(".dropdown-toggle");內click處理程序鏈接到$(document)使用.hasClass()或.is()檢查event.target爲.dropdown-toggle，鏈.hide()

$(".dropdown-toggle").on("click", function() { 
    $(this).toggle(); 
}); 

$(document).on("click", function(event) { 
if (!$(event.target).hasClass(".dropdown-toggle")) $(event.target).hide(); 
});