Question

我编写了下面显示的代码来调用lightbox show和callback一些函数，比如function_a，但它会触发16次。

我怎样才能让它只开一次？

$("#open").click(function(){
    $('.a, .b, .c, .d').fadeOut(600,function(){
        $('.e, .f, .g, .h').fadeIn(400,function(){
            function_a();
        });
    });
});

function_a(){
    console.log('fire')
};

Answer 1

您可以使用$.fn.promise，f.ex：

$("#open").click(function(){
    $('.a, .b, .c, .d').fadeOut(600).promise().done(function(){
        $('.e, .f, .g, .h').fadeIn(400).promise().done(function(){
            function_a();
        });
    });
});

来自文档：

.promise（）方法返回一个动态生成的Promise 一旦绑定到集合的某个类型的所有操作解决，排队与否，已经结束。

另请注意classNames must be at least 2 characters long。

Answer 2

这是因为你可能有16个元素，哪个类具有指定的类有一个变量来跟踪它

$("#open").click(function(){
    var iCount=0;
    $('.a, .b, .c, .d').fadeOut(600,function(){
        $('.e, .f, .g, .h').fadeIn(400,function(){
            if(iCount==0)
               function_a();
            iCount++;
        });
    });
});

Answer 3

试试这个：

var fired = 0; 
$("#open").click(function(){
    $('.a, .b, .c, .d').fadeOut(600,function(){
        $('.e, .f, .g, .h').fadeIn(400,function(){
            if (fired < 1) function_a();
            fired ++;
        });
    });
});

function_a(){
    console.log('fire')
};

执行功能不超过一次

3 个答案: