Question

我遇到了JavaScript和onclick事件的问题。我想从我在循环中创建的元素定义onclick事件。我的代码看起来像这样：

for (var i = 0; i < result.entries.length; i++) {
  var entry = result.entries[i];
  var adder = document.createElement('span');
  adder.innerHTML = '+';
  adder.onclick = function () {
    addFeed(entry.title, entry.url);
    backButton();
  };
  container.appendChild(adder);
}

问题是，这段代码创建了一个这样的事件监听器：

listenerBody: "function () {addFeed(entry.title, entry.url); backButton();}"

但我需要entry.title和entry.url的值，如：

listenerBody: "function () {addFeed('ABC', 'http://example.com'); backButton();}"

我希望有人可以帮助我。

Answer 1

你刚刚在javascript中遇到了一个名为hoisting and closure looping的东西。

正在发生的事情是你的循环继续，并且当触发onclick函数时，entry变量中的内容是result.entries的最后一个元素。

要解决此问题，您可以将其锁定在闭包中（示例）：

function setOnClickEvent(element, entryValue) {
  element.onclick = function () {
    addFeed(entryValue.title, entryValue.url);
    backButton();
  };
}

for (var i = 0; i < result.entries.length; i++) {
  var entry = result.entries[i];
  var adder = document.createElement('span');
  adder.innerHTML = '+';
  setOnClickEvent( adder, entry)
  container.appendChild(adder);
}

来自循环的JS onclick事件

1 个答案: