不太详细的方式来链接必须等待动画的jquery事件吗？

Question

链接在jQuery中很棒，但它链接每个事件的触发器，并且不会等待上一个事件完成。这在动画时尤为明显。

因此，我见过的解决方法是使用回调函数。唯一的缺点是，如果你有4件你想连续动画的东西。

不可否认，这可能是你不想经常做的事情，但是当你这样做时，标记似乎有点冗长。示例（伪代码）：

element.animate(fast, callBackFunction1(element1,element2,element3); 

function callBackFunction1(element1,element2,element3){ 
    element1.animate(fast, callBackFunction2(element2,element3)); 
}; 

function callBackFunction2(element2,element3){ 
    element2.animate(fast, callBackFunction3(element3)); 
}; 

function callBackFunction3(element3){ 
    element3.animate(fast); 
}; 

在这种情况下，是最好的/最简洁的方式去做事吗？

Answer 1

请尝试以下.. :)

element.animate(fast, function() { 
    element1.animate(fast, function() { 
     element2.animate(fast, function() { 
      element3.animate(fast); 
     }); 
    }); 
}); 

Answer 2

var animElements = [ 
    element, 
    element1, 
    element2, 
    element3, 
]; 

function animateChain(elements) { 
    if(elements.length > 0) { 
     var element = elements.pop(); 
     element.animate("fast", function(){ animateChain(elements); }); 
    } 
} 

animateChain(animElements);