javascript - 为一组元素动态创建回调函数

Question

该变量myCollection包含jQueryDOM 元素，我想callback为它们的每个事件设置一个函数，onclick如下所示。实际上我想要的是，增量设置或可以说“烧掉”number每个元素，所以当它们被点击时，它自己的号码会被提醒。此代码提醒最后一次number在循环中何时递增的最后一个值。

var number = 1;

myCollection.each(function(){
    this.onclick = function() { someFunction(number) };
    number++;
});

//This function is somewhere else, but accessible.
function someFunction(number) {
    alert(number);
}

如何复制或实例化每个元素的回调函数，以便它们具有相同的过程但绑定不同的参数？

Answer 1

一个经典的作用域问题，可以这样解决：

myCollection.each(function(){
  this.onclick=(function(number) {
      // in this scope, number has been "burned"
      return function() {
          someFunction(number)
      };
  }(number));
  number++;
});

请注意，jQuery 已经在每个回调中包含了正确范围的索引，因此您需要做的就是：

myCollection.each(function(i){
    $(this).click(function(){
        someFunction(i+1);
    });
});