等待for循环中的jQueryanimation完成

我有类似下面的代码

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

如何使循环中的每次迭代只在fadeIn（）; 动画完成了吗？

编辑—对不起我坏了我没有在循环中包含’i’

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次。

无论如何，你需要的是将调用放在fadein方法的回调中： 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(); }); } 

您可以更改延迟function内的持续时间。 这是jsFiddle。

Answer 5

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

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

代替

  $(this).fadeIn();