如何在點擊時切換動作

Question

===問題NR.1 ===

有人知道如何制作此javascript toogle-bar嗎？ 我知道toogleClass，但是在這種情況下如何使用呢？

$('.gallery').click(function(e){
            var itemNumber = ('#myCarousel2 .item').length;

            console.log('broj slika je' + ' ' + itemNumber);
            if (itemNumber >= 4){
                $('#myCarousel2 .carousel-inner .item').addClass('active');
                console.log('added Active class!');
                $('#myCarousel2').addClass('thumbnail-gallery');
                $('.modal').css('pointer-events', 'none');
            };
        });

我正在嘗試恢復第二次 .gallery單擊的操作。 一旦用戶點擊元素名為.gallery上添加這個。主動類，我將取消對類的名為.gallery第二次點擊它。

更新：：

我在這里談論Twitter引導程序。 如果這樣做，它將刪除我的所有活動類（包括當前圖像中的其中一個），這些類另外添加到了項中。 我只想刪除最近添加的活動類。

更新nr.2-第一個問題的解決方案

下面是解決toogleing點擊功能：

var itemNumber = ('#myCarousel2 .item').length;
        $(".gallery").toggle(
        function() {
            if (itemNumber >= 4){
                $('#myCarousel2 .carousel-inner .item:not(.active)').addClass("active");
                console.log('added Active class!');
                $('#myCarousel2').addClass('thumbnail-gallery');
                $('.modal').css('pointer-events', 'none');
            };
        }, 
        function() {
            $('#myCarousel2 .carousel-inner .item').removeClass('active');
            console.log('added Active class!');
            $('#myCarousel2').removeClass('thumbnail-gallery');
            $('.modal').css('pointer-events', 'auto');
        });

===問題NR.2 ===

我仍然在尋找第二個問題的答案，當我嘗試刪除已添加的所有類時，該問題就會出現。 有人對此有解決方案嗎？

Answer 1

您需要做的只是檢查活動類是否存在。

 if($('#myCarousel2 .carousel-inner .item')hasClass('active')){
    $('#myCarousel2 .carousel-inner .item')removeClass('active');
 }

Answer 2

要遍歷類，您必須執行以下操作：

$('#myCarousel2 .carousel-inner .item').toggleClass("active");

要選擇所有未激活的項目，您需要這樣的東西：

$('#myCarousel2 .carousel-inner .item:not(.active)').addClass("active");