I just encountered a situation in which I needed to wait for multiple animations to complete before continuing execution, but I only wanted the next command to execute once (as opposed to once per animating element).
Normally, I would do something like this:
|
1 2 3 4 |
var myElements = $('.my_selector'); myElements.slideUp(function(){ doSomethingAfterSlideUp(); }); |
However, if I do this, doSomethingAfterSlideUp() will be executed myElements.length times.
Enter the promise() function. If I change this to look like so, I get the desired bahavior:
|
1 2 3 4 5 |
var myElements = $('.my_multiple_element_selector'); myElements.slideUp(); myElements.promise().done(function(){ doSomethingAfterSlideUp(); // executes exactly once (assuming myElements.length > 0) }); |
