jQuery的顯示/隱藏在列表

Question

每個元件的問題是，我想改變的innerHTML的屬性格式對於在列表中的每個名稱和動畫處理（淡入，延遲對於x秒，淡出）

<div id="welcomeBox">Welcome SOMETHING</div> 

var list = ["George","Bob","Tom"]; 

$.each(list, function() 
{ 
    $("#welcomeBox") 
     .eq(0) 
     .text('Welcome' + this) 
     .fadeToggle(1500) 
     .delay(5000) 
     .fadeToggle(1500); 
}); 

隨着代碼以上我只是得到3x歡迎湯姆消息。

Answer 1

var list=["George","Bob","Tom"]; 

// recursive closure to iterate thru list 
(function recurse(index){ 
    // on fade use the callback to fade out 
    $("#welcomeBox").text('Welcome ' + list[index]).fadeIn(1500, function(){ 
     $("#welcomeBox").fadeOut(1500, function(){ 
      // after fade out, call the function again with the next index 
      recurse(undefined !== list[index+1] ? index+1 : 0); 
     }); 
    }); 
})(0); 

https://jsfiddle.net/6qo0L6mr/