跨多个元素的 jQuery 动画队列

Question

这个问题类似于this one about animation queues ，但该线程中的答案非常具体，不容易一概而论。

在我的网络应用程序中，通过输出带有 class="alert" 的 div 例如，消息会报告给用户(信息框、错误和警告等) :

<div class="alert">Login successful</div>
<div class="alert">You have new messages waiting</div>

页面上可能有任意数量的警报，具体取决于用户的操作。

我想要的是使用 jQuery 动画按顺序显示每个警报框:一个动画结束后，下一个动画开始。

另一个问题的答案说使用回调，例如:

$('#Div1').slideDown('fast', function(){
    $('#Div2').slideDown('fast');
});

除非要设置动画的 div 数量未知，否则该方法将不起作用。有人知道实现这一目标的方法吗？

Answer 1

我想出了一个解决方案，尽管我隐隐怀疑对 JS 闭包了解更多的人可能会给我一些指导。

nextAnim($('.alert'));

function nextAnim($alerts) {
    $alerts
        .eq(0)    // get the first element
        .show("slow",
            function() {
                nextAnim($alerts.slice(1));  // slice off the first element
            }
        )
    ;
}