jQuery多setTimeout代碼混亂

Question

我想通過在jQuery中使用setTimeout函數創建一個動畫。這工作得很好，動畫完美，但我的代碼現在是如此混亂。

setTimeout(function() { 
      $('p').fadeOut(); 

      setTimeout(function() { 
       var heightLoading = $('#loading').height(); 
       $("#loading").css("margin-top", height); 
       $('#loading').html("Anyways, I am a <span>Web Designer</span> and <span>Front-end Developper</span>").fadeIn(); 

       setTimeout(function() { 
        $('#name').fadeIn(); 
       }, 2000); 
      }, 1000) 
     }, 3000); 

     }, 800); 
}, 2000); 

是否有不同的方式做到這一點？現在它是setTimeout中的setTimeout等。如果我繼續這樣，這真是令人困惑。

在此先感謝！

Answer 1

可以簡化鏈接有點通過跳過setTimeout和使用內置的時機和回調：

$('p').fadeOut(800, function() { var heighLoading.... 

如果你想刪除的功能築巢更這裏有一個插件，可以幫助：

http://creativecouple.github.io/jquery-timing/