tojgle class on and off jquery

Question

如果单击不同的点击，我如何打开和关闭班级？

我有两次单击，并且在单击时切换了一个类，但是如果我单击2，则没有1的类仍处于活动状态。

$('.show-15').on('click', function () {
        if (clicks < 0) {
            clicks = 0
        }
        $(this).toggleClass('active-post');
        cards.slice(clicks, cards.length).fadeOut();
        cards.slice(0, 15).fadeIn();
    });

    $('.show-25').on('click', function () {
        if (clicks < 0) {
            clicks = 0
        }
        $(this).toggleClass('active-post');
        cards.slice(clicks, cards.length).fadeOut();
        cards.slice(0, 25).fadeIn();
    });

Answer 1

您可以这样操作：

$('.show-15').on('click', function () {
    if (clicks < 0) {
        clicks = 0
    }
    $(".active-post").not(this).removeClass("active-post");
    $(this).toggleClass('active-post');
    cards.slice(clicks, cards.length).fadeOut();
    cards.slice(0, 15).fadeIn();
});

$('.show-25').on('click', function () {
    if (clicks < 0) {
        clicks = 0
    }
    $(".active-post").not(this).removeClass("active-post");
    $(this).toggleClass('active-post');
    cards.slice(clicks, cards.length).fadeOut();
    cards.slice(0, 25).fadeIn();
});

Answer 2

您可以将toggle()事件用作

$(".show-15").toggle(
    function(){
        if (clicks < 0) {
            clicks = 0
        }
        $(this).toggleClass('active-post');
        cards.slice(clicks, cards.length).fadeOut();
        cards.slice(0, 15).fadeIn();},

        function(){
        if (clicks < 0) {
            clicks = 0
        }
        $(this).toggleClass('active-post');
        cards.slice(clicks, cards.length).fadeOut();
        cards.slice(0, 25).fadeIn(););
  });