javascript - 我怎样才能让数组延迟显示一个？

Question

每个 div 显示为一个块，我希望它们在页面准备好时开始显示

<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)
};

演示：小提琴