Javascript JQuery事件在循环中提前触发

我有一个多输入的表单。我在顶部有一个下拉列表，其中列出了记录ID。当有人选择一个记录ID时，会触发一个ajax请求并返回该记录的属性。然后，我用所述属性动态填写表单。返回的属性之一是电子邮件数组。我不知道会退回多少

我的

.done

ajax响应中有一个循环。我想在返回的每封电子邮件上创建一个事件处理程序，允许用户从表单中删除该电子邮件。我的问题是，当ajax响应加载到DOM中时，会触发我的事件，即使该事件是一个on

click

事件

有人知道为什么“删除电子邮件”功能会在加载时而不是单击时启动吗

请参阅下面的代码：

 ...
$form_post.done(function(data) {
   $('#button').button('reset');
   //success information here
   data = JSON.parse(data);
  for(var i = 0; i < data.emails.length; i++){
       $('#li_' + data.emails[i].id).on('click','#icon_' + data.emails[i].id,delete_email(data.emails[i].id));
  }
});

function delete_email($id){
    alert('hit');
    $('#li_' + $id).hide();
    $('#hidden_' + $id).val('');
}

回答-这就是最终有效的方法。感谢@Tushar帮助我解决问题

(function (i) {
    $('#li_' + data.emails[i].id).on('click', '#icon_' + data.emails[i].id, function () {
         delete_email(data.emails[i].id);
     });
}(i));

---

delete_电子邮件

在

单击

事件时是否显示为被调用，而不是被名称引用

尝试用

函数.prototype.bind（）

替换调用

delete\u email

，将

数据.email[i].id

作为参数传递

for(var i = 0; i < data.emails.length; i++){
   (function (i) {
     $('#li_' + data.emails[i].id)
    .on('click', '#icon_' + data.emails[i].id
      , delete_email.bind(null, data.emails[i].id)
    );
   }(i));
}

for（var i=0；i

---

功能删除电子邮件（$id）{
console.log（$id）
}
var arr=[“a”、“b”、“c”]；
对于（变量i=0；i

Change

delete_-email（data.emails[i].id）

to

function（）{delete_-email（data.emails[i].id）}）请参阅以获取解释我无法通过匿名函数引用我的
数据.emails[i].id
。这就是为什么我把它自己搬出去，这样我就可以给它发送一个值。我该如何解决这个问题呢？用函数包装它，看看你也必须使用匿名函数，看看我的第一条评论。同时检查fiddle中的代码，完全按照原样使用它。您的fiddler有一个小的输入错误，但是，它工作了！你可以发布你的答案，我会把它标记为有效！还建议匿名函数使用param调用函数，我总是避免使用
bind
，因为它会将您以前的上下文抛出窗口，以防OP/您仍然想要访问它，您无法取回它
for(var i = 0; i < data.emails.length; i++){
   (function (i) {
     $('#li_' + data.emails[i].id)
    .on('click', '#icon_' + data.emails[i].id
      , delete_email.bind(null, data.emails[i].id)
    );
   }(i));
}