如果點擊了獨特的元素/如果在div之外點擊（包括另一個獨特的元素）

Question

我正在尋找一種方法來切換基於點擊的類。說了一個例子，我有這樣的：

<div id="element_1"> <!-- notice unique id attached to the end --> 
    <button>My Button</button> 
    <div class="hidden_wrapper"> 
     <span>Something</span> 
     <span>Something else</span> 
    </div> 
</div> 

據我瞭解，我可以做這樣的事情來觸發唯一ID（未經測試）：

$(document).on("click", "[id^=element] button", function() { $('[id^=element] hidden_wrapper').toggleClass('some_class'); }); 

我想什麼是切換如果在我的#element_1 .hidden_wrapper以外的任何東西被點擊，該類獨特的ID（這實際上將刪除類）下的類別

有人可以請在這裏擺脫一些光？

Answer 1

爲整個文檔設置點擊處理程序。在該處理程序中，切換除目標以外的所有元素的類。這是一個快速和骯髒的版本;更優雅的方法是可能的。

$("html").on("click", function() { 
    $(".hidden_wrapper").toggleClass("some_class"); 
    $(this).next().toggleClass("some_class"); 
}) 

這是因爲不雅

• 它切換你不想更換了兩次的元素（有點像一個雙重否定）
• 這取決於該元件爲的下一個兄弟上按鈕。

這兩個問題很容易用更多的代碼修復。