jQuery - 当我们点击另一个div时,从div中删除类

Question

jQuery(document).ready(function() { 
    if(jQuery(window).width() < 768){
        jQuery('.nb-team-grid').on('click', function(e){
            jQuery(this).toggleClass('test');
        });
    }
})

嘿家伙,我需要做一个互动.当我们点击一​​个div时,一个类需要添加,当我们再次点击时,该类应该删除它的自我.我做到了,你可以看到上面的代码.还有一件事我需要的是,我根据设计重复了很多次div.因此,如果我们单击任何div,则应该从我们之前单击的div中自动删除该类.请查看此链接以获得更多说明.谢谢 :)

http://dev.netbramha.in/projects/test-coder/test.html 点击此链接中显示的每个网格

Answer 1

选择兄弟元素并从中删除目标类

$('.nb-team-grid').on('click', function(e){
  $(this).toggleClass('test').siblings().removeClass('test');
});

.test {color:red}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="nb-team-grid">nb-team-grid</div>
<div class="nb-team-grid">nb-team-grid</div>
<div class="nb-team-grid">nb-team-grid</div>
<div class="nb-team-grid">nb-team-grid</div>

如果.nb-team-grid不是兄弟姐妹使用底码

$('.nb-team-grid').on('click', function(e){
  $(this).toggleClass('test')
  $(".nb-team-grid").not(this).removeClass('test');
});