不能循环数组；每个项目单独工作答案

【问题标题】：Can't loop over array; each item works individually不能循环数组；每个项目单独工作
【发布时间】：2018-10-25 18:11:54
【问题描述】：

以下代码按预期工作：

var slctr = "What's new";
var section = document.querySelector('[aria-label="'+slctr +'"]');
var sectionAs = section.querySelectorAll('a');
$(sectionAs).click(function(e){
    e.preventDefault();
    var t = $(e.target).text();
    var sectionTitle = section.getAttribute('aria-label');
    alert('Title: ' + sectionTitle+', text: ' + t);
    return false;
});

如果我尝试将此应用于每个 {{section}}，则工作停止：

var sections = [
    "What's new",
    "What's newish",
    "What's not new at all"
    ];

for(var l = 0; l < sections.length; l++){
    var slctr = sections[i];
    var section = document.querySelector('[aria-label="'+slctr +'"]');
    var sectionAs = section.querySelectorAll('a');
    $(sectionAs).click(function(e){
        e.preventDefault();
        var t = $(e.target).text();
        var sectionTitle = section.getAttribute('aria-label');
        alert('Title: ' + sectionTitle + ', text: ' + t);
        return false;
    });
}

为什么它对循环不起作用？

【问题讨论】：

任何控制台错误？
你必须使用闭包...当循环结束时，i 的值已经不一样了。
嗯 l 和 i。
为什么要混合使用 DOM 和 jQuery 来选择元素？真的没有理由你甚至需要循环每个元素.....
@epascarello - 感谢您的评论。不幸的是，我没有资格回答您问题中的“为什么”。我只是在做我能想到的唯一方法。你能推荐更好的吗？

标签： javascript jquery arrays loops

【解决方案1】：

在设置一些事件处理程序时，您需要使用闭包或 IIFE，它们有时是异步的。你只需要像这样更新你的代码：

var sections = [
  "What's new",
  "What's newish",
  "What's not new at all"
];

for (var i = 0; i < sections.length; i++) {
  (function (i) {
    var slctr = sections[i];
    var section = document.querySelector('[aria-label="' + slctr + '"]');
    var sectionAs = section.querySelectorAll('a');
    $(sectionAs).click(function(e) {
      e.preventDefault();
      var t = $(e.target).text();
      var sectionTitle = section.getAttribute('aria-label');
      alert('Title: ' + sectionTitle + ', text: ' + t);
      return false;
    });
  })(i);
}

还有一件事是您使用了i 用于索引和l 用于循环。

【讨论】：

谢谢普拉文。抱歉，我不允许为您的评论点赞。
@RomanK 谢谢伙计...没关系。我对你的问题投了赞成票。享受！ :)

【解决方案2】：

您使用l 作为循环变量，但随后尝试访问section[i] 和i 未定义

var slctr = sections[l];

【讨论】：

谢谢。这很尴尬。