等待一个jQueryanimation内for循环

Question

完成我有类似如下的代码

for(i=0, j=10; i<j ; i++){ 
    $('#an-element-'+i).fadeIn(); 
} 

如何让这个循环中每次迭代只一次淡入开始（）;动画已完成？

编辑---对不起我的坏我没有包括“我”在环

Answer 1

for循环是同步的，但动画是异步的。你需要使用递归。

var i = 0, j = 10; 
(function fadeNext() { 
    if (i < j) { 
     $('#an-element-' + i++).fadeIn(fadeNext); 
    } 
})(); 

http://jsfiddle.net/uq9mH/

Answer 2

根据你的代码，你的循环只会在同一个元素淡出10次。

在任何情况下，你需要的是将通话的淡入方法的回调：http://api.jquery.com/fadeIn/

像这样的东西应该工作（未测试）

var counter = 10; 
function fadeIn(elem) { 
    $(elem).fadeIn('slow', function(){ 
     if (counter > 0) { 
      fadeIn(elem); //up to you how you figure out which element to fade in 
     } 
    }); 
    counter--; 
} 

//var elem = $('.something'); 
fadeIn(elem); 

Answer 3

后，您可以执行代码通过将其放置在作为回调参数传递的函数中的动画：

$("#foo").fadeIn("slow",function() { 
    alert("done"); 
}); 

但是它并不十分清楚你想要做什么。你是否褪色了同样的元素10次？

Answer 4

试试这个：

for (i = 0, j = 10; i < j; i++) { 
    $('.try').each(function() { 
     $(this).delay(1000).fadeOut().delay(1000).fadeIn(); 
    }); 
} 

您可以更改延迟函数内的持续时间。 Here is the jsFiddle.

Answer 5

，如果你对所有项目进行了固定的延迟，你可以使用下面这行代码：

$(this).fadeIn().delay(2000).fadeOut(); 

，而不是

$(this).fadeIn();