weniger ausführlich Weg zur Kette jquery Ereignisse, die für Animationen warten?

Question

Chaining ist groß in jQuery, aber es Ketten der Auslöser für jedes Ereignis und wartet nicht auf Vorveranstaltung zu beenden. Dies ist vor allem dann bemerkbar, wenn Animieren.

Als solche kann die Abhilfe, die ich gesehen habe, ist Funktionen zurückrufen zu verwenden. Der einzige Nachteil ist, wenn, sagen wir, Sie 4 Dinge, die Sie nacheinander animieren möchten.

Zugegeben, das ist wahrscheinlich etwas, was Sie wollen nicht sehr oft zu tun, aber wenn Sie das tun, scheint das Markup ein bisschen ausführlicher zu bekommen. Beispiel (Pseudo-Code):

element.animate(fast, callBackFunction1(element1,element2,element3);

function callBackFunction1(element1,element2,element3){
    element1.animate(fast, callBackFunction2(element2,element3));
};

function callBackFunction2(element2,element3){
    element2.animate(fast, callBackFunction3(element3));
};

function callBackFunction3(element3){
    element3.animate(fast);
};

In dieser Situation ist, dass die beste / knappste Art und Weise über die Dinge zu gehen?

Answer 1

Versuchen Sie Folgendes ..:)

element.animate(fast, function() {
    element1.animate(fast, function() {
        element2.animate(fast, function() {
            element3.animate(fast);
        });
    });
});

Answer 2

var animElements = [
    element,
    element1,
    element2,
    element3,
];

function animateChain(elements) {
    if(elements.length > 0) {
        var element = elements.pop();
        element.animate("fast", function(){ animateChain(elements); });
    }
}

animateChain(animElements);