Question

我在对象数组中动态构建<ul>，其中每个列表项在单击链接时调用函数。但是，该函数仅从对象数组中的最后一项传递参数。这是我的代码......

var list = document.createElement("ul");
var object;

for (var i = 0; i < myObjects.length; i++)
{
    object = myObjects[i];

    listItem = document.createElement("li");
    image = document.createElement("img");
    image.setAttribute("src", object.image_url)
    listItem.appendChild(image);
    listItem.appendChild(document.createTextNode(object.title));

    link.setAttribute("href", "#");
    link.addEventListener("click", function(){someFunction(object.id);}, false);
    link.appendChild(document.createTextNode("Click Me!"));
    listItem.appendChild(link);

    list.appendChild(listItem);
}

element.appendChild(list);

所有变量都在同一个函数中声明，因此不使用全局变量。在有人建议之前，我没有使用jQuery，因为在我继续使用任何库之前，我正试图了解javascript的基础知识。

提前感谢您的帮助。

B先生

Answer 1

由于范围的作用方式，匿名函数引用了变量，而不是值。稍后更改该变量时，更改将反映在anon函数中。

也许使用封口技巧可以起作用？

更改

link.addEventListener("click", function(){someFunction(object.id);}, false);

要

(function(O) {
   link.addEventListener("click", function(){someFunction(O.id);}, false);
})(object);

如果我没有弄错的话，那就是创建一个新变量，其值不会受到object循环中for的后续更改的影响。

Answer 2

啊，这是一个典型的关闭问题。

您需要将object.id传递给包装函数，如下所示：

(function(id) {
   link.addEventListener("click", function(){someFunction(id);}, false);
})(object.id);

动态列表中的匿名函数传递相同的参数值

2 个答案: