jQuery while循环不等动画

Question

我有一个jQuery函数,它.clone()在一个对象上执行,然后在克隆对象上执行.insertAfter()a和a .slideDown().整个函数包含在while循环中.我将尽可能简洁明了地展示一个通用示例:

while (statement) {
    // code for clone and insert  ...
    $("#newly_created_object").slideDown(500);
}

如何在.slideDown()动画(或任何其他类型的动画)结束之前阻止下一个while循环触发？

先感谢您 !

Answer 1

您可能希望首先创建并插入所有元素,并将它们存储在数组中.然后,您可以使用递归函数从数组中弹出一个元素并为其设置动画,在动画的回调处理程序中的其余元素上调用函数 - 以确保第一个元素在下一次启动之前完成.

    ...
    var elems = [];
    while (statement) {
        var elem = ...clone and insert element, returning element...
        elems.push(elem);
    }

    animateElems( elems);
}


function animateElems( elems )
{
    if (elems.length > 0) {
        var elem = elems.shift();
        $(elem).slideDown( 500, function() {
             animateElems( elems );
        }
    }
}