Javascript 我如何解释setTimeout的这种行为？

我有一段代码

           var wsr = $('#work-sample-row');
            for (var i = 0, n = newRows.length; i < n; ++i)
            {
                var thisBox = box.clone();
                var thisNewRow = newRows[i];
                thisBox.find('.work-item-preview-outer').css('background-image', 'url(' + thisNewRow['imageurl'] + ')');
                thisBox.find('.work-title').text(thisNewRow['title']);
                thisBox.find('.work-descr-short').text(thisNewRow['sumsmall']);
                thisBox.find('.work-link-wrap').attr('href', siteUrl + '/our-work/ ' + workUrlPiece + '?id=' + thisNewRow['id']);
                wsr.append(thisBox); 
                setTimeout(function(){thisBox.css('opacity','1');}, i * 300);
            }     

---

这是有效的，但这当然是不雅观的，因为我需要再次遍历元素。我怎样才能让第一条路起作用

这是因为执行

setTimeout

回调时，

thisBox

变量引用最后一个克隆的对象。JavaScript（不是ECMAScript 2015）不支持块作用域功能

您可以使用一个立即调用的函数，该函数类似于

每个
回调创建一个新的作用域

 for (var i = 0, n = newRows.length; i < n; ++i) {
    var thisBox = box.clone();
    // ...
    (function(box, index) {
        setTimeout(function(){ box.css('opacity','1');}, index * 300);
    })(thisBox, i);
 }   

for（变量i=0，n=newRows.length；i
什么是
框
和
新行
？告诉我们这些是如何定义的。@bleeted0d
box
is
$（“
”）
和
新行
是来自server@DelightedD0D是的，该点有一个记忆传递/定义值的函数。
 for (var i = 0, n = newRows.length; i < n; ++i) {
    var thisBox = box.clone();
    // ...
    (function(box, index) {
        setTimeout(function(){ box.css('opacity','1');}, index * 300);
    })(thisBox, i);
 }