jQuery的每个循环

我坚持了解每个循环的行为。jQuery的每个循环

这里是我的代码：

$.each(thumbs, function() { // where thumbs is array of strings 
    project = this; 

    $('#gallery').append(
     '<li>' 
     + '<a href="/portfolio/' + project + '">' 
     + '<img src="/img/' + project + '_bw.jpg" id="' + project + '_bw" />' 
     + '<img src="/img/' + project + '_tn.jpg" id="' + project + '_tn" />' 
     + '</a>' 
     + '</li>' 
    ); 

    // alert(project); - alerts every element of array as expected 

    $('#' + project + '_bw').load(function() { 

     // alert(project); - alerts only the last element of array, 
     // but as many times as many elements in array 

     $('#' + project + '_bw').fadeIn(150,function(){ 
      $('#' + project + '_tn').css("opacity", 1); 
     }); 
    }); 
});

的问题是，当我试图定义元素，在这里我想执行.load功能的ID，它十分重视这一功能只的最后一个元素我正在循环的数组。

来源

2013-09-22 zee

你需要把你的负载在外部功能，并通过项目作为参数，并调用在循环功能（见范围） –

嗨3dgoo，确保万无一失。它是字符串数组：“proja”，“projb”，“projc” – zee

您的负载没有时间来完成循环以完成所有迭代，以确保每个循环都触发一个独特的加载操作，如上所述 –

您的问题是project的范围是在您的每个循环之外定义的。

因此，所有thumbs都被循环，并设置负载监听器。但是，当第一个加载事件被调用并且调用了加载监听器函数时，project变量被设置为循环的最后一个值。

所以你需要做的是在每个循环内设置一个局部变量来为每次迭代设置变量。

试试这个：

的Javascript

$.each(thumbs, function() { 
    var thisProject = this; 

    $('#gallery').append(
     '<li>' + '<a href="/portfolio/' + thisProject + '"><img src="/img/' + thisProject + '_bw.jpg" id="' + thisProject + '_bw" /><img src="/img/' + thisProject + '_tn.jpg" id="' + thisProject + '_tn" /></a></li>'); 

    $('#' + thisProject + '_bw').load(function() { 
     $('#' + thisProject + '_bw').fadeIn(150, function() { 
      $('#' + thisProject + '_tn').css("opacity", 1); 
     }); 
    }); 
});

这是问题的一个例子：

HTML

<div id="output"></div>

的Javascript

var count = 0; 
$.each([500,1000,1500,2000,2500], function() { 
    var thisValue = this; 
    var inScopeCount = count + 1; 
    setTimeout(function() { 
     $('#output').append('<strong>For ' + thisValue + ':</strong><br />count: ' + count + '<br /> inScopeCount: ' + inScopeCount + '<br />'); 
    }, this); 
    count += 1; 
});

Demo

来源

2013-09-22 22:13:42 3dgoo

Hi @ 3dgoo，感谢您的评论，我不确定这是否是晚上工作时间，但我看不出你的“尝试这个”代码和我的任何区别。请注意我的变量“project”是在“.each”函数中定义的，就像你的var“thisProject”一样。我错过了什么吗？ – zee

区别在于在每个内部用'var'声明它。这将为这个循环的实例创建变量。演示显示了差异。看一次jsfiddle备份并运行。 – 3dgoo

jQuery的每个循环

回答

相关问题