javascript - jquery not function 没有按预期工作

标签 javascript jquery html

我使用下面的代码为 div 切换类。

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
<head>
</head>
<body>  
   <div class="members-section " id="as-member"><img 
    src="img/test1.jpg" alt="">
    <span>Join as a new member</span>
  </div>
   <div class="members-section " id="as-student"><img 
    src="img/test2.jpg" alt=""> 
    <span>Join as a student</span>
  </div>
  <div class="members-section "><img src="img/test3,jpg" alt="">
   <span>Upgrade my membership</span>
 </div>
 <div class="members-section test-member">
  <h5>Teest...</h5>
   <ul class="member-options">
    <li><span>Discounts</span></li>
    <li><span>Institute access</span></li>
    <li><span>Library access</span></li>
    <li><span>Market events</span></li>
   </ul>
</div>
<script>        
$(document).ready(function($) {
    $('#as-member').click(function(e){
        $('.members-section').not($(this)).toggleClass('unselected');
    });         
 });
 </script>
</body>
</html>

上面的代码将未选择的类切换到除当前单击元素之外的所有其他 div。

所以我希望 div 也不应该切换包含类 "test-member"

请问这可以实现吗?任何人都会调查这个并告诉我你的想法谢谢。

最佳答案

使用额外的 not()方法就是这样。此外,您无需包装 this 即可与 not() 一起使用方法,因为它接受 DOM 元素对象作为参数。

$(document).ready(function($) {
  $('#as-member').click(function(e){
    $('.members-section').not(this).not('.test-member').toggleClass('unselected');
    // here -----------------------^^^^^^^^^^^^^^^^^^^------
  });         
});


或者你可以添加伪类选择器 :not()与主选择器。

$(document).ready(function($) {
  $('#as-member').click(function(e){
    $('.members-section:not(.test-member)').not(this).toggleClass('unselected');
    // here -----------^^^^^^^^^^^^^^^^^^^^-----------------
  });         
});

关于javascript - jquery not function 没有按预期工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55332797/

相关文章:

javascript - WebGL:如何绘制五边形?

javascript - 在 CodeMirror Textarea 的插入符号处插入文本

javascript - 价格范围 slider 在 mozilla 浏览器中不起作用,但在 chrome 和 opera 浏览器中起作用

javascript - Rails 4 jquery 函数只工作一次,而不是重新加载

jquery - 从匿名点击处理函数中删除 jQuery 点击处理程序

javascript - 如果 div 单击多次,变量会创建多个输入?

html - 您可以使用 if/else 语句在 erb 中设置 div 的样式吗?

javascript - 正确解析 JavaScript 八进制转义序列

Javascript 显示隐藏两个单选按钮的公共(public) Div

javascript - 如何将 PWA 重定向到新服务器