添加和删​​除类onClick操作

Question

 <button class="fbutton btn pull-right filterevents " id="one" >School Events</button>
  <button class="fbutton btn pull-right filterevents" id="two" >Zone Events</button>
  <button class="fbutton btn pull-right filterevents" id="three" >My Events</button>

我需要添加课程＆＃34;选择＆＃34;到特定按钮onClick。

我的代码是

$("#one").click(function(e) {
                $(this).addClass("fcurrent");
                $("#two").removeClass("fcurrent");
                 $("#three").removeClass("fcurrent");
   });

如果我使用而不是像下面这样的类，

$(".fbutton").click(function(e) {
                    $(this).addClass("fcurrent");
       });

然后如何将fcurrent类删除到另外两个按钮

Answer 1

试试这个。

$(".fbutton").click(function (e) {
$(this).addClass("fcurrent").siblings().removeClass("fcurrent");
});

DEMO

Answer 2

$(".fbutton").click(function(e) {
    $(".fbutton").removeClass("fcurrent");
    $(this).addClass("fcurrent");
});

Answer 3

您可以先从所有按钮元素中删除.fcurrent类，然后将您的类添加到当前按钮，如下所示：

$(".fbutton").click(function(e) {
    $(".fbutton").removeClass("fcurrent");
    $(this).addClass("fcurrent");
}

Answer 4

如果您只对这些按钮使用fcurrent类，则可以在将类添加到当前按钮之前从具有该类的任何其他按钮中删除该类：

$('.fbutton').click(function(e) {
    $('.fcurrent').removeClass('fcurrent');
    $(this).addClass('fcurrent');
});

Answer 5

您可以先从所有按钮中删除类fcurrent，然后将其再次添加到您单击的按钮中。

$(".fbutton").click(function(e) {
   $(".fbutton").removeClass("fcurrent");
   $(this).addClass("fcurrent");
});

Answer 6

你可以试试这个 -

$(".fbutton").click(function(e) {
    $(".fbutton").removeClass("fcurrent");
    $(this).addClass("fcurrent");
});