jquery - jquery动画回调调用一次而不是每个元素

Question

$($('div').children()).animate({opacity:"0"},
                        function(){
                                $(this).remove();
                                $('div').append('new content');
                            }
                        );

新内容每次都增加一倍，我将如何让回调函数只触发一次而不是每个孩子？

Answer 1

.promise一起使用.done：

从文档中：

该.promise()方法返回一个动态生成的 Promise，一旦绑定到集合的特定类型的所有操作（无论是否排队）都结束，该 Promise 就会被解析。

默认情况下，type 为“fx”，这意味着返回的 Promise 在所选元素的所有动画都完成后解析。

所以用法是：

$(myElements).animate(...).promise().done(function() {
    // called only when _all_ of the animations on
    // "myElements" elements have completed
});