Javascript将参数传递给变量内部的函数

Question

我试图将点击处理程序分配给在变量中定义的JQuery对象：

some.object.array[8].action = function(data){console.log(data);}
anotherobject = {..}

现在在某个循环中，我需要将此函数分配给点击处理程序：并想传递整个“另一个对象”对象

for (var i = 0; i < foo.length; i++) {
    $('<div/>').click(some.object.array[i].action);
}

但是如何传递参数？ 如果将其封装在某些匿名函数中，那么我将失去作用域...：

for (var i = 0; i < foo.length; i++) {
    $('<div/>').click(function() {
        some.object.array[i].action(anotherobject)
    });
}

因为i改变了...

我们应该怎么做呢？

Answer 1

有太多方法可以做到这一点：

for (var i = 0; i < foo.length; i++) {
    (function(i) {
        $('<div/>').click(function() {
            some.object.array[i].action(anotherobject);
        });
    })(i);
}

要么

for (var i = 0; i < foo.length; i++) {
    $('<div/>').data("i", i).click(function() {
            var i = $(this).data("i");
            some.object.array[i].action(anotherobject);
        });
    });
}

要么

function getClickHandler(callback, parameter) {
    return function() { callback(parameter); };
};
for (var i = 0; i < foo.length; i++) {
    $('<div/>').click(getClickHandler(some.object.array[i].action, anotherobject));
}

Answer 2

for(var i = 0; i < foo.length; i++)
{
  $('<div/>').click(
    (
      return function(callback){
        callback(anotherobject)
      }
    )(some.object.array[i].action)
  );
}

Answer 3

如果要让action函数将div保持为this并且仍然接受jQuery事件对象，则可以使用如以下示例的bind ：

function action(another, event){
    console.log(this, arguments);
}

$(function(){
    for (var i = 0; i<10; i++) {
        var anotherObject = "another"+i;
        var div = $('<div>'+i+'</div>');
        // force 'this' to be 'div.get(0)'
        // and 'arg0' to be 'anotherObject'
        div.click(action.bind(div.get(0),anotherObject));
        $("body").append(div);
    }
})

示例： https : //jsfiddle.net/Lwe5b9cx/您需要打开控制台以查看输出，该输出应如下所示：