动态调用的函数，未定义参数

Question

我正在动态生成一个图库，每个图库项目都有一个onClick事件，该事件调用一个将项目值作为参数的函数。

我测试了不带“”的代码，并定义了值，但是该函数在创建项目时运行，而不是在单击时运行。

当我使用“”时，该函数仅在单击时运行，但得到未定义的值

我想动态创建该函数，并在使用值作为参数的单击时触发它。

jsGallery是我正在循环以构建图库项目的数组。

图库商品代码

function createDiv(type) {
  jsGallery.forEach((item) => {
    if (item.type === type) {
      let newDiv = document.createElement("div");
      newDiv.setAttribute("value", item.id);
      newDiv.setAttribute("class", "item" + " " + type);
      newDiv.setAttribute("id", "dynamic");

      newDiv.setAttribute("onClick", "testFire(value)");

      document.getElementById("galleryContainer").appendChild(newDiv);
    }
  })
}

TestFire功能

function testFire(value) {
  console.log(value);
}

Answer 1

testFire（value）的参数是不存在的绑定，这就是为什么它返回未定义的原因。

代替

newDiv.setAttribute("onClick", "testFire(value)");，

执行：

newDiv.onclick = () => testFire(newDiv.value);

顺便说一句，它仍然返回undefined，因为div元素只有global attributes。

Answer 2

感谢Andre Neuchter，我使用了您的方法，但由于值仍按未定义的值返回，因此对其进行了一些改动。

newDiv.onclick = () => testFire(item.id);

Answer 3

更改此：