jquery - 无法使:not()选择器正常运行

我正在建立一个div和跨度的选择框。一切正常，但是现在我尝试添加：not（）选择器，以检测当用户单击＃signup-currency-selectbox及其子项以外的任何内容时，下拉框是否可见。如果可见，则此时需要将其隐藏。这是我目前拥有的：

HTML：

<div id="signup-currency-selectbox" class='selectBox'>
    <span id="signup_currency" class='selected'></span>
    <span class='selectArrow'></span>
    <div class="selectOptions" >
        <span class="selectOption signup-currency" value="1"  >$USD</span>
        <span class="selectOption signup-currency" value="4"  >£GBP</span>
        <span class="selectOption signup-currency" value="6"  >€EUR</span>
        <span class="selectOption signup-currency" value="2"  >$CAD</span>
        <span class="selectOption signup-currency" value="3"  >$AUD</span>
    </div>
</div>

jQuery的：

$(":not(.selectBox)").click(function(){
     $('div.selectOptions').css('display','none');
});

现在，我有多个带有.selectBox类的selectbox，因此，每当用户单击.selectBox以外的其他内容时，最好使用.each吗？由于某些原因，即使单击.selectBox及其任何子级，该功能也将执行。有人在这里看到任何问题吗？另外，我删除了if语句（不确定是否需要它）。

最佳答案

kes，看起来像一个低效的选择器。我会这样做：

$(document).click(function() {
    $('div.selectOptions').hide();
});

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

如果在.selectBox之外单击，事件将冒泡到document，并且div将被隐藏。如果单击内部，将防止冒泡，并且div将保持打开状态。

关于jquery - 无法使:not()选择器正常运行，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21175325/