如果点击了独特的元素/如果在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"); 
}) 

这是因为不雅

• 它切换你不想更换了两次的元素（有点像一个双重否定）
• 这取决于该元件为的下一个兄弟上按钮。

这两个问题很容易用更多的代码修复。