jQuery如果没有，请单击

我正在用div和span标签创建一个选择框，这样我就可以为iphone和ipad创建一个样式框。它工作得很好，但一旦用户单击该框并显示下拉选择，删除选择列表的唯一方法就是选择其中一个选择，或者再次单击selectbox本身。我正在寻找一个函数，它将关闭用户单击页面上任何其他内容的选择列表，而不是列表（当列表打开时）。这是我处理选项列表显示的函数

jQuery：

    $(this).children('.selectedOption,.selectDropDownArrow').click(function(){
        if($(this).parent().children('.selectOptions').css('display') == 'none'){
            $(this).parent().children('.selectOptions').css('display','block');
        } else {
            $(this).parent().children('.selectOptions').css('display','none');
        }
    });

现在我需要这样的东西来处理网站其他部分的点击：

$('!.selectedOption,!.selectDropDownArrow').click(function() {
  if (!$('.selectOptions').css('display','none')) {
    $('.selectOptions').css('display','none');
  }
});

有人知道实现这一点的方法吗？

使用

---

由于您正在切换可见性，请尝试将代码css更改为直接使用

描述：显示或隐藏匹配的元素

代码：

然后使用

：not

选择所有内容，但不选择您的类，然后使用

隐藏

描述：选择与给定元素不匹配的所有元素 选择器

代码：

更新 当您单击元素并将事件冒泡到它的祖先时，在您的情况下，元素将被常规隐藏处理程序隐藏

避免这种使用

参考：

描述：防止事件在DOM树中冒泡， 防止任何父处理程序收到事件通知

代码：

---

演示：

无论何时使用上述代码（使用not选择器），我都无法再单击。选择选项或。选择下拉箭头并显示列表。你的功能有道理，我只是不明白为什么它对我不起作用=/

$(":not(.selectedOption,.selectDropDownArrow)").click(function(){
  //do whatever
});

$(this).children('.selectedOption,.selectDropDownArrow').click(function(){
   $(this).parent().children('.selectOptions').toggle();
});

$(":not(.selectedOption,.selectDropDownArrow)").click(function(){
  $('.selectOptions').hide();
});

$(":not(.selectedOption, .selectDropDownArrow)").click(function (e) {
    alert('general');
    e.stopPropagation();
});

$(".selectedOption,.selectDropDownArrow").click(function (e) {
    alert('specific');
    e.stopPropagation();
});