这个问题在这里已经有一个答案：>
JavaScript closure inside loops – simple practical example30个
题
题
回调函数如何从创建时保留一个局部变量？
简单的例子
我正在创建一个视频播放器.它将有滑块来控制饱和度,对比度和色调.当用户使用滑块进行播放时,需要确认哪个滑块已更改,并更改了哪些值.问题是滑块的名称是这个onChange回调的创建者的范围的局部变量.这个回调如何保留滑块的名称？
HTML
<div id="saturation"> <div class="track"></div> <div class="knob"></div> </div> </div> <div id="contrast"> <div class="track"></div> <div class="knob"></div> </div> </div> <div id="hue"> <div class="track"></div> <div class="knob"></div> </div> </div>
JS
var elements = [
'saturation','contrast','gamma'
];
for(var i = 0; i < sliders.size(); i++) {
new Control.Slider(
$(elements[i]).down('.knob'),$(elements[i]).down('.track'),{
onChange: function(value) {
// ERROR: elements[i] is undefined
alert(elements[i] + ' has been changed to ' + value);
}
}
}
解决方法
相同的变量,我 – 谁的价值最终是4 – 绑定到您在循环中创建的每个功能.您可以将函数包装在您现场调用的另一个函数中,并将i作为参数传递给该函数：
for(var i = 0; i < sliders.size(); i++) {
new Control.Slider(
$(elements[i]).down('.knob'),{
onChange: (function(inner_i) { function(value) {
alert(elements[inner_i] + ' has been changed to ' + value);
} })(i)
}
}