如果您选择一个类或一组元素来使用jQuery进行动画处理:
$('.myElems').animate({....});
然后也使用回调函数,你最终得到了很多不必要的animate()调用。
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++; }); });
可以说这只是坏的代码和/或设计 – 但是有一些我可以做的,既避免有许多animate()调用,只有其中一个使用回调,并有一个不必要的回调执行和旋转我的代码/预期行为?
理想情况下,我只能编写一个只能运行一次的一次性回调 – 否则可能有一种有效的方法来测试某些东西是否已经被jQuery动画了?
示例:http://jsfiddle.net/uzSE6/(警告 – 这将显示一个警报框的加载)。
解决方法
你可以使用
when
喜欢:
$.when($('.myElems').animate({width: 200},200)).then(function () { console.log('foo'); });
替代版本:
$('.myElems').animate({width: 200},200).promise().done(function () { console.log('foo'); });