jQuery fadeIn在其回调中运行两次

Question

var counter = 0;
jQuery("#div1, #div2").fadeIn('300',function(){
{
    counter++;
    console.log(counter);
}

上面的代码将打印"1"和"2",因为jQuery fadeIn隐含在两个不同的DOM对象上.反正有没有让它只运行一次而不破坏这段代码？

Answer 1

简单的解决方案:

$("#div1").fadeIn(300);
$("#div2").fadeIn(300,function(){
   // do something only once
});

最干净的解决方案是使用jQuery的promise系统:

$.when($("#div1, #div2").fadeIn('300')).done(function(){
   // do something only once
});

示范

Answer 2

这是一个快速的解决方案，但不是最好的

var myFlag = true;
jQuery("#div1, #div2").fadeIn('300',function(){
{
    if(myFlag == true)
    {
        // write the code here
        myFlag = false;
    }
}

希望这会有所帮助......穆罕默德。