等待带有动画的功能完成，直到运行另一个功能

Question

我在正常（非ajax）函数中遇到了问题，每个函数中都包含很多动画。目前，我只是具有一个setTimeoutbetween函数，但这并不是完美的，因为没有浏览器/计算机是相同的。

附加说明：它们都有碰撞的单独动画/等。

我不能简单地将一个放在另一个的回调函数中

// multiple dom animations / etc

FunctionOne();

// What I -was- doing to wait till running the next function filled

// with animations, etc

setTimeout(function () { 

    FunctionTwo(); // other dom animations (some triggering on previous ones)

}, 1000); 

无论如何在js / jQuery中有：

// Pseudo-code

-do FunctionOne()

-when finished :: run -> FunctionTwo()

我知道$.when()＆$.done()，但是这些是针对AJAX的...

我更新的解决方案

jQuery有一个名为$ .timers的暴露变量（由于某种原因未在jQuery文档中的任何地方列出），该变量保存当前发生的动画数组。

function animationsTest (callback) {

    // Test if ANY/ALL page animations are currently active

    var testAnimationInterval = setInterval(function () {

        if (! $.timers.length) { // any page animations finished

            clearInterval(testAnimationInterval);

            callback();

        }

    }, 25);

};

基本用法：

// run some function with animations etc    

functionWithAnimations();

animationsTest(function () { // <-- this will run once all the above animations are finished

    // your callback (things to do after all animations are done)

    runNextAnimations();

});

Answer 1

在第一个函数的末尾添加以下内容return $.Deferred().resolve();像这样调用两个函数functionOne().done(functionTwo);

Answer 2

除了Yoshi的答案，我还找到了另一个非常简单的动画（回调类型）解决方案。jQuery有一个公开变量（由于某种原因未在jQuery文档中列出），称为$ .timers，该变量保存当前正在发生的动画数组。function animationsTest (callback) {&nbsp; &nbsp; // Test if ANY/ALL page animations are currently active&nbsp; &nbsp; var testAnimationInterval = setInterval(function () {&nbsp; &nbsp; &nbsp; &nbsp; if (! $.timers.length) { // any page animations finished&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; clearInterval(testAnimationInterval);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; callback();&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }, 25);};基本用法：functionOne(); // one with animationsanimationsTest(functionTwo);希望这可以帮助一些人！