jQuery $.animate () wiele elementów, ale wywołanie zwrotne tylko raz

Jeśli wybierzesz klasę lub kolekcję elementów do animowania za pomocą jQuery:

$('.myElems').animate({....});

A następnie również użyć funkcji callback, kończy się dużo unneccessary animate() połączeń.

var i=1;
$('.myElems').animate({width:'200px'}, 200, function(){
    //do something else
    $('#someOtherElem').animate({opacity:'1'}, 300, function(){        
        if (i>1) console.log('the '+i+'-th waste of resources just finished wasting your resources');
        i++;
    });
});

Prawdopodobnie jest to po prostu zły kod i / lub projekt - ale czy jest coś, co mogę zrobić, że zarówno unika wielu animate() połączeń z tylko jednym z nich za pomocą callback, i mając obciążenie unneccessary wywołań zwrotnych wykonywania i wkręcania z mojego kodu / oczekiwanego zachowania?

Idealnie wystarczy być w stanie kodować pojedyncze "jednorazowe" wywołanie zwrotne, które będzie działać tylko raz-w przeciwnym razie może istnieje skuteczny sposób, aby sprawdzić, czy coś jest już animowane przez jQuery?

Przykład: http://jsfiddle.net/uzSE6 / (warning-to pokaże ilość pól alarmowych).

Author: totallyNotLizards, 2012-01-09

2 answers

You could use when like:

$.when($('.myElems').animate({width: 200}, 200)).then(function () {
  console.log('foo');
});

Http://jsfiddle.net/tyqZq/

Wersja Alternatywna:

$('.myElems').animate({width: 200}, 200).promise().done(function () {
  console.log('foo');
});
 102
Author: Yoshi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-01-11 09:18:00

Możesz utworzyć zmienną blokującą second + callback...

var i=1;
$('.myElems').animate({width:'200px'}, 200, function(){
    //do something else
    $('#someOtherElem').animate({opacity:'1'}, 300, function(){        
        if (i>1) return;
        else
        {
            console.log('the '+i+'-th waste of resources just finished wasting your resources');
            i++;
        }
    });
});

To odpali tylko raz, ponieważ każde kolejne wywołanie zwrotne zostanie anulowane:)

 2
Author: bardiir,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-01-09 18:30:31