如何在jQuery中动画多个动画时多次调用回调

Question

考虑这段代码......

$(function() {

  for (var i = 0; i < 10; i++) {
    $('body').append('<div style="width: 30px; height: 30px; background: red; margin: 10px;" />')

    }

      $('div').slideUp(1000, function() {

        $('body').append('done sliding');

      });

});

(在JSbin上看到)

它会创建10 div秒然后将它们向上滑动.回调被调用10次,当我希望它被调用一次(毕竟完成滑动后).

我知道我可以做一个布尔或类似的东西,hasCalledCallback但有没有任何其他更优雅的方法来使多个元素动画只调用一次完成回调？

Answer 1

试试这个

if ($('div:animated').length == 1)
        $('body').append('done sliding');

演示