在哪里放置 addEventListener 的闭包

Where to put closure for addEventListener?

本文关键字：闭包 addEventListener 在哪里      更新时间：2023-09-26

我读到可以在循环中使用 addEventListener 的闭包（addEventListener 使用 for 循环和传递值）。

但是，此方法不适用于更复杂的示例：

function f(fevent) {
  var a = document.createElement('a');
  a.innerHTML = 'Test';
  a.href = '#';
  a.addEventListener('click', fevent);
  return a;
};
for (l = 0; l < 2; l += 1) {
  for (h = 0; h < 2; h += 1) {
    document.body.appendChild(
    f(function() {alert(l+','+h);})
    );
  }
}

https://jsfiddle.net/yasnujzq/

编辑：我想要的是锚点上的单击事件来提醒不同的组合（0，0），（1，0），（0，1）和（1，1）。但它总是提醒 （2，2）。

这是我从上面尝试的闭包方法：

function f(fevent) {
  var a = document.createElement('a');
  a.innerHTML = 'Test';
  a.href = '#';
  a.addEventListener('click', fevent);
  return a;
};
for (l = 0; l < 2; l += 1) {
  for (h = 0; h < 2; h += 1) {
    (function() {
                document.body.appendChild(
                f(function() {alert(l+','+h);})
                );
    }());
  }

https://jsfiddle.net/72sg8d5n/

我还尝试在闭包中添加参数：

function f(fevent) {
  var a = document.createElement('a');
  a.innerHTML = 'Test';
  a.href = '#';
  a.addEventListener('click', fevent);
  return a;
};
for (l = 0; l < 2; l += 1) {
  for (h = 0; h < 2; h += 1) {
    (function() {
                document.body.appendChild(
                f(function() {alert(l+','+h);})
                );
    }(l,h));
  }
}

https://jsfiddle.net/wxodr8p6/

也许有人可以在这方面启发我。

编辑：这是下面接受的解决方案中的方法的工作小提琴：

https://jsfiddle.net/87zp4dkr/

(function() {
            document.body.appendChild(
            f(function() {alert(l+','+h);})
            );
}(l,h));

在此代码的最后一行，您将向函数传递两个参数。

在第一行，您不接受任何参数。

您

不使用传递给该函数的值，您仍然使用循环中的值（每次循环时都会更改）。

(function(my_l, my_h) {
            document.body.appendChild(
            f(function() {alert(my_l+','+my_h);})
            );
}(l,h));
相关文章：