选择器：不在 jQuery 中不起作用答案

【问题标题】：Selector :not in jQuery not working选择器：不在 jQuery 中不起作用
【发布时间】：2015-06-30 23:46:23
【问题描述】：

我有一个 ID 为 body 的主体，其中有一个类为 nav-container 的 div。当用户单击#body 时，我想删除某些类，而不是.nav-container（它是一种覆盖类型的菜单）。

试过下面的代码

HTML：

<body id="body">
  <div class="nav-container">
    <a href="#" id="close-btn"> X </a>
    <nav class="display">
      <ul>
        <li><a href="#"> One </a></li>
        <li><a href="#"> Two </a></li>
        <li><a href="#"> Three </a></li>
     </ul>
   </nav>
 </div>
</body>

jQuery

$('#body :not(.nav-container)').click(function() {
    $('.cover').removeClass('active-cover');
    $('.nav-container').removeClass('active');
});

但它似乎对我不起作用。

【问题讨论】：

这会将点击事件绑定到正文下的每个标签，但一个，当然你需要更具体。

标签： javascript jquery html jquery-selectors

【解决方案1】：

因为.nav-container 不是#body 选择的列表的一部分，所以not 排除了通过早期css-selector 标准的选定元素（在这种情况下不会作为其ID 列出），它不会起作用，所以你将无法排除它。所以基本上你需要的是

$(document).on("click", "div:not('.nav-container')",function() {
    $('.cover').removeClass('active-cover');
    $('.nav-container').removeClass('active');
});

【讨论】：

更新了答案，如果你解释一下你的确切要求会更清楚

【解决方案2】：

第一个元素不应该是父元素，比如#body，而是元素。例如div:not('example') 适用于除示例之外的每个 div。

$("div:not(.nav-container)").click(function() {
alert("nav-container was not clicked");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body id="body">
  <div class="nav-container">
    <a href="#" id="close-btn"> X </a>
    <nav class="display">
      <ul>
        <li><a href="#"> One </a></li>
        <li><a href="#"> Two </a></li>
        <li><a href="#"> Three </a></li>
     </ul>
   </nav>
 </div>
  <br />
  <div>click here </div>
</body>

【讨论】：

@Niralana 如果您测试 sn-p，它的工作方式就是这样。你确定类名正确吗？
所提供的 sn-p 在您单击的任何位置都会显示相同的警报