Jquery - 推迟回调，直到多个动画完成 [英] Jquery - defer callback until multiple animations are complete

问题描述

我需要在多个元素完成动画后执行一次回调.我的jquery选择器如下:

I need a callback to execute once after multiple elements have finished animating. My jquery selector is as follows:

$('.buttons').fadeIn('fast',function() {
   // my callback
});

这里的问题是按钮类匹配了许多元素，所有这些元素都需要在执行回调之前淡入.就目前而言，回调在每个单独的元素完成动画后执行.这不是所需的功能.我正在寻找一个优雅的解决方案，这样我的回调只在所有匹配的元素完成动画后执行一次.这个问题已经出现在包括 SO 在内的几个地方，但从来没有一个优雅的答案(甚至没有一个明确的答案 - 对一个人有效的解决方案对其他人根本无效).

The problem with this is that the buttons class matches a number of elements, all of which need to be faded in before the callback is executed. As it stands now, the callback is executed after each individual element has finished animating. This is NOT the desired function. I'm looking for an elegant solution such that my callback is only executed once after all the matched elements have finished animating. This question has popped up in a few places including SO, but there's never been an elegant answer (nor even a definitive answer for that matter - solutions that work for one person don't work at all for others).

推荐答案

@Ross 答案的替代方案，该答案将始终触发最后一个按钮淡入的回调(这可能是也可能不是被告知的最后一个按钮)动画)可能是:

An alternative to @Ross's answer that will always trigger the callback on the last button to fade in (which may or may not be the last button that was told to animate) could be:

var buttons = $(".buttons");
var numbuttons = buttons.length;
var i = 0;

buttons.fadeIn('fast', function() {
    i++;
    if(i == numbuttons) {
        //do your callback stuff
    }
});

这篇关于Jquery - 推迟回调，直到多个动画完成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！