jQuery if hasclass then 函数

Question

这是一个动画，仅当 div rip_tab 具有类“rip_tab_ripped”时才会触发，该类在单击 div 后应用。但是，动画甚至在 rip_tab_ripped 类切换之前就已触发。每个函数单独工作，无需 if 子句。任何帮助将不胜感激--

var sauceSquirt = {
    init: function() {

        $("#rip_tab").click(function() {
            $(this).toggleClass("rip_tab_ripped");
        });



        function fireA() {
            $("#sauceRed").switchClass("sauce_hide", "sauceRedGo", 500)
        }

        function fireB() {
            $("#sauceBlue").switchClass("sauce_hide", "sauceBlueGo", 500)
        }

        if ($('#rip_tab').hasClass("rip_tab_ripped")) {


            $('#packet').click(function() {

                var events = [fireA, fireB];

                //declare counter
                if (!this.counter) {
                    this.counter = 0;
                }

                events[this.counter]();
                this.counter = (this.counter + 1) % 3;
            });



        }

    }

}

$(document).ready(function() {
    sauceSquirt.init();

});​

Answer 1

看起来您在这部分遇到了问题:

if ($('#rip_tab').hasClass("rip_tab_ripped")) {
    $('#packet').click(function() {

       var events = [fireA, fireB];

       //declare counter
       if(!this.counter) { this.counter = 0; }

       events[this.counter]();
       this.counter = (this.counter + 1) % 3;
    });
}

您可以将其更改为:

$('#packet').click(function() {
    if ($('#rip_tab').hasClass("rip_tab_ripped")) {

           var events = [fireA, fireB];

           //declare counter
           if(!this.counter) { this.counter = 0; }

           events[this.counter]();
           this.counter = (this.counter + 1) % 3;
    }
    return false;
});

您还可以查看jQuery Promise