Jquery等到所有动画完成后再开始新动画

我有一个菜单，其中包含附加到hover事件的slideDown / slideup动画。

如果我将鼠标hover在下一个菜单位置上，而之前仍然使用slideDown进行动画处理，我想等待slideDown完成，然后才启动slideUp以获取当前位置。

我试图使用promise对象，但它根本不起作用。

$('.menu-2>ul>li').each(function(){ $(this).hover( function(){ var choice = $('ul', this); ('.menu-2>ul>li>ul').promise().done(function( ) { choice.slideDown(); }); }, function(){ $('ul', this).slideUp(200); } ); }); 

Answer 1

您可以在slideDown完成后添加回调。 试试例子：

 choice.slideDown("fast",function(){your function}) 

这只是调用动画完成

UPDATE

 $('.menu-2>ul>li').each(function(){ $(this).hover( function(){ var choice = $('ul', this); ('.menu-2>ul>li>ul').promise().done(function( ) { choice.slideDown(500); }); }, function(){ $('ul', this).delay(500).slideUp(200); } ); });