如何讓數組一次顯示一個延遲？

Question

每格顯示爲一個塊，我希望他們 開始顯示頁面時準備好了（）

<div id="blocks"> 


</div> 

輸入代碼

var mainArray = new Array(); 

mainArray[0] = "<div class='tile'> </div>" 
mainArray[1] = "<div class='tile'> </div>" 
mainArray[2] = "<div class='tile'> </div>" 
     //adds to #blocks 
for (var i = 0; i < mainArray[i].length; i++) { 
$('#blocks').append(mainArray[i]) 
}; 

Answer 1

嘗試使用的setTimeout

var mainArray = new Array(); 

mainArray[0] = "<div class='tile'>1</div>" 
mainArray[1] = "<div class='tile'>2</div>" 
mainArray[2] = "<div class='tile'>3</div>" 
//adds to #blocks 
for (var i = 0; i < mainArray.length; i++) { 
    (function(idx){ 
     setTimeout(function(){ 
      $(mainArray[idx]).hide().appendTo('#blocks').fadeIn() 
     }, idx * 2000) 
    })(i) 
}; 

演示：Fiddle