javascript - 将局部变量传递给回调函数

标签 javascript scope prototypejs

<分区>

问题

回调函数如何保留其创建时的局部变量?

简单示例

我正在创建一个视频播放器。它将有 slider 来控制饱和度、对比度和色调。当用户使用 slider 时,它需要确认更改了哪个 slider 以及它更改为什么值。问题在于 slider 的名称是此 onChange 回调创建者范围内的局部变量。这个回调如何保留 slider 的名称?

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

最佳答案

为每个回调创建变量的副本,您可以使用传入值的匿名函数来执行此操作:

for(var i = 0; i < sliders.size(); i++) {

    (function(e) { // get a local copy of the current value

        new Control.Slider(
          $(elements[e]).down('.knob'),
          $(elements[e]).down('.track'), {
           onChange: function(value) {
            // ERROR: elements[e] is undefined
            alert(elements[e] + ' has been changed to ' + value);
           }
         }

     })(i); // pass in the current value
}

这样您就不会多次引用相同的i

关于javascript - 将局部变量传递给回调函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4466098/

相关文章:

c - 无法理解 C 中的文件范围

prototypejs - 使用原型(prototype)和脚本隐藏和显示 div 元素

关联数组上的 Javascript SHIFT 和 POP

java - 我该如何解决这个简单的范围界定错误?

javascript - 非常大数据集的 D3 TreeMap

javascript - IF 是 JavaScript 中的函数吗?

javascript - 如何使用原型(prototype)js附加一堆选项来选择HTML中的标签

javascript - 你如何干净地删除 Prototype JS 中的 DOM 元素?

javascript - CSS3 选择器 [*|type ="toc"]

javascript - 显示带有警报的文本框名称的语法