Question

我已经设置了这样的功能......

$('.trigger').click(function(){
  $('.active').removeClass('active');
  $(this).addClass('active');
});

当用户点击.trigger时，它会将该类添加为有效，但我还需要在用户再次点击.active时删除该有效课程。我该怎么做？

Answer 1

$('.trigger').click(function(){
     $(this).toggleClass('active');
});

Answer 2

在查看您提供的方案时，您必须正在寻找.toggleClass()

尝试，

$('.trigger').click(function(){
  $('.active').not($(this)).removeClass('active');
  $(this).toggleClass('active');
});

DEMO

Answer 3

为此用途：

$('.active').click(function () { // click on active
  $(this).removeClass('active'); // remove class!
});

Answer 4

尝试这样的事情

$('.trigger').click(function(){
    if($(this).hasClass('active')){
        $(this).removeClass('active');
    }else{
      $(this).addClass('active');
    }
});

替代代码

$('.trigger').click(function(){
    $(this).toggleClass( "active" );
});

使用 toggleClass() jquery函数

在匹配元素集中的每个元素中添加或删除一个或多个类，具体取决于类的存在或switch参数的值。

Answer 5

试试这个：

$('.trigger').click(function(){
  $(this).toggleClass('active').siblings('.trigger').removeClass('active');
});  //---^^^^^^^^^^^-------------toggling the class names are required here.

Demo @ Fiddle

Answer 6

听起来有点像你在寻找：

$('.trigger').click(function() {
    $(this).addClass('active');
});

$('.active').click(function() {
    $('.trigger').removeClass('active');
});

第一次点击功能来自您的陈述：

当用户点击.trigger时，它会添加活动类

第二次点击功能来自你说：

但我还需要在用户再次单击.active时删除活动类。

在此声明中，您的意思是当用户点击.active或.trigger时？此解决方案基于您的意思.active，就像您的陈述所暗示的那样。

希望这有用！

单击添加/删除类

6 个答案:

DEMO

Demo @ Fiddle