为什么总是在循环中使用对对象的最后一个引用

Why always the last reference to the object is used in loop?

本文关键字:对象 最后一个 引用 循环 为什么      更新时间:2023-09-26

assemblyEl创建正确(1.jpg、2.jpg、3.jpg(,但ajax请求总是发送最后一个id(3(。

为什么会发生这种情况以及如何解决?

var assemblies = [{id:1},{id:2},{id:3}];
for (var a in assemblies) {
    var assembly = assemblies[a];
    var assemblyEl = $('<img src="' + assembly.id + '.jpg" />')
                        .click(function () {
                                 $.ajax({
                                     type: "POST",
                                     url: url,
                                     data: { id: assembly.id },
                                     async: false,
                                     success: function (data) {
                                     }
                                 });
                         });
}

因为点击元素时会触发点击事件。此时,assembly的值是循环中的最后一个值。

使用闭包将值复制到新作用域。

function clickHandler(assembly) {
    return function () {
         $.ajax({
              type: "POST",
              url: url,
              data: { id: assembly.id },
              async: false,
              success: function (data) {
              }
          });
    };
}
.click(clickHandler(assembly));