从匿名函数访问外部变量

Question

我之前问过这个问题，与This Thread有关联，这对我来说并没有什么帮助。

我有一个类的实例列表，这些类存储对DOM元素的引用，以及方法和INT。

我需要遍历每个类实例并将方法分配给元素的click事件。

 zpool attach -f pool device new_device

以下是课程：

for(var i = 0, l=children.length; i<l; i++) {
      var child = children[i];
      if(child.nodeType === 1 && child.tagName === "LI") {
        listItems[x] = new subMenu(child);
        child.addEventListener('click', function(x) {
          listItems[x].toggle(); <!------- x is always 7, it should be 0-6
        }, false);
        x++;
      }
    }

以下是class subMenu { constructor(obj) { this.elm = obj; this.state = 0; } toggle() { if (this.state === 0) { addClass(this.elm, 'toggled'); this.state = 1; } else { removeClass(this.elm, 'toggled'); this.state = 0; } } } 的图片：

修改 如果我通过链接帖子进行更改，我认为是正确的，我得到了这个：

listItems

但是，var menuParent = document.getElementById('megamenu'); var children = menuParent.childNodes; var x = 0; for(var i = 0, l=children.length; i<l; i++) { var child = children[i]; if(child.nodeType === 1 && child.tagName === "LI") { listItems[x] = new subMenu(child); child.addEventListener('click', bindToggle(x), false); x++; } } function bindToggle(i) { return listItems[i].toggle(); } }, false); 方法在分配时只运行一次，然后在单击元素时不再运行。

编辑2 对不起，我确实第一次做了更正，只是上面的代码错了。所以我修改了我的代码以将函数返回给EventHandler。

toggle()

然而，var menuParent = document.getElementById('megamenu'); var children = menuParent.childNodes; var x = 0; for(var i = 0, l=children.length; i<l; i++) { var child = children[i]; if(child.nodeType === 1 && child.tagName === "LI") { listItems[x] = new subMenu(child); child.addEventListener('click', bindToggle(x), false); x++; } } function bindToggle(x) { return function() { console.log("Value: " + x); }; // listItems[x].toggle(); } 只是输出

  

价值：2

如果我在EventHandler`上方添加一个console.log那么它会显示0-6，所以传递给函数的值不应该是问题。

Answer 1

这是引用问题的接受答案中的代码：

function createfunc(i) {
    return function() { console.log("My value: " + i); };
}

它返回一个函数。 （返回值传递给addEventListener）。

这是您的等效代码：

function bindToggle(i) {
  return listItems[i].toggle();
}

只是做东西然后什么都不返回（undefined）。

然后这段代码：

child.addEventListener('click', bindToggle(x), false);

尝试将undefined绑定为事件处理程序。

您必须将功能传递给addEventListener