使用jQuery向元素添加动态函数

我正在尝试将动态.change()函数附加到元素列表：

 els = new Array('#element1','#element2'); for (i=1; i < 3; i++){ $(els[i]).change(function(){ alert(i); }); } 

这不能按预期工作，因为i没有传递给函数，而是总是等于最后一次迭代，即2.如何将值传递给变量change(function{}) ？

Answer 1

这样做的两种方法。

使用$.each

 var element_array = new Array('#element1','#element2'); $.each( element_array, function( index, value ){ $(value).change(function(){ alert( index ); }); }); 

创建一个闭包。

 var element_array = new Array('#element1','#element2'); for ( i = 0; i < element_array.length; i++){ (function(i){ $(element_array[i]).change(function(){ alert(i); }); })(i); } 

Answer 2

所有生成的函数都引用相同的变量： i 。 当循环继续时，此变量随后会发生变化，因此，当您的更改事件触发时， i将设置为2 。

您必须创建一个本地范围，在创建函数时存储i的值：

 els = new Array('#element1','#element2'); for (i=1; i < 3; i++){ (function(i){ $(els[i]).change(function(){ alert(i); }); })(i); } 

Answer 3

jQuery事件可以在signiture中获取eventData并将其作为参数传递给回调函数。 来自jQuery文档：

 .change( [eventData], handler(eventObject) ) 

你想要的是这个（我已经改变了arg名称以保持显而易见）：

 for (i=1; i < 3; i++){ $(els[i]).change({index: i}, function(event){ alert(event.data.index); }); } 

Answer 4

你尝试过类似的东西吗？

els = new Array（’＃element1’，’＃element2’）;

for (i=1; i < 3; i++){ $(els[i]).bind( 'change', function(){ alert(i); }); }

加载页面时，jQuery不知道数组的值，它就像一个字符串。