如何在 jQuery .each() 函数中使变量可访问？答案

【问题标题】：How to make variable accessible within jQuery .each() function?如何在 jQuery .each() 函数中使变量可访问？
【发布时间】：2013-02-23 07:45:10
【问题描述】：

这是一个常见困境的例子：如何在这个.each() 中使markup 可访问？

我对学习如何从闭包中访问外部变量比对这个特定问题更感兴趣。我可以通过在每个函数内部分配markup 来解决这个问题，但我宁愿学习一种更优雅的方法来处理这类问题。

// hide form & display markup
function assessmentResults(){

  // get assessment responses
  var markup = parseForm();

  // show assessment results to user
  $('#cps-assess-form fieldset').each( function() {
    var q = $(this).find('.fieldset-wrapper');
    var i = 0;

    // hide form questions
    q.slideUp();

    // insert markup
    $('<div>'+markup[i]+'</div>').insertAfter(q);
    i++;
  });

}

【问题讨论】：

标记已经可以在 .each 中分配的匿名函数中访问，这正是闭包的含义。
在.each() 的每次迭代开始时，您将变量i 重置为0。
我认为.each() 被过度使用了，与传统的迭代器相比它也相当慢。为什么人们如此害怕使用旧的 for 循环？
@sweetamylase 它的好处是this 是你所追求的。
@epascarello this 只是指集合中的元素之一，很容易是var this = elements[i]。通过将 jQuery 对象包裹在 $(this) 周围，仅此步骤对性能的影响就比 this = elements[i] 更大

标签： javascript jquery scope closures

【解决方案1】：

阅读docs，它已经有索引了！

.each( function(index, Element) )

不需要i

$('#cps-assess-form fieldset').each( function(index) {
    var q = $(this).find('.fieldset-wrapper').slideUp();
    $('<div/>').html(markup[index]).insertAfter(q);
});

您失败的原因是i 在函数内部，因此每次迭代都会重置。您需要将其移到函数之外才能正常工作。

【讨论】：