我想在完成另一个代码后执行一个代码

Question

我已经写了一个jQuery CLICK事件，在这种情况下有两个代码会在点击事件后执行，但我想先完成第一个代码执行，然后完成后开始执行第二个代码。但是现在它们都在CLICK事件触发的同时执行。

第一个代码是关于slideUp的，所以我想先完成slideUp然后开始执行第二个代码。这里是Fiddle

我在这里附上了代码和图片，请检查并帮助我，如果可以的话。

$(".team-item-area").on('click', function(){ 
     $(this).siblings().find('.team-item-right-para').slideUp(); 
     $(this).find(".team-item-right-para").slideToggle(function(){ 
      var check = $(this).is(":visible"); 

      if(check == true) 
      { 
       $(this).parents('.team-item-area').siblings().find('img').hide(); 
       $(this).parents('.team-item-area').find("img").fadeIn(); 
      } else { 
       $(this).parents('.team-item-area').find("img").show(); 
       $(this).parents('.team-item-area').siblings().find('img').fadeIn(); 
      } 
     }); 


    })[enter image description here][1] 

Answer 1

按照documentation的效果基本show函数是一旦动画完成，将被调用的函数第二个参数。第一个参数是幻灯片的持续时间。你可以设置你想要的（400是默认值）

$(this).siblings().find('.team-item-right-para').slideUp(400, function { 
    ... code to execute after the slide is complete... 
}); 

Answer 2

使用的slideToggle方法在这里面，你可以完成 http://api.jquery.com/slidetoggle/

Answer 3

或者使用中提到的解决方案@BenM或使用事端这样之后什么：

$(this).find(first operation) 
    .delay(1) 
    .queue(function (next) { 
     $(this).find(second operation); 
     next(); 
});