在 JavaScript 循环中分配点击处理程序时如何避免闭包问题？

解决循环内单击处理程序分配中的闭包问题

将单击处理程序分配给循环中的多个元素时，由于 JavaScript 中的闭包，会出现一个常见的陷阱。提供的代码显示了此问题：

$(document).ready(function(){
  for(var i = 0; i <p>此代码旨在在发生单击时显示被单击元素的索引。但是，每次点击它都会错误地显示“您点击了 20”，而不是显示实际索引。此行为源于循环中创建的闭包。</p><h3 id="解决方案-使用回调函数">解决方案：使用回调函数</h3><p>要解决此问题，我们可以使用回调函数，如下所示：</p><pre class="brush:php;toolbar:false">function createCallback( i ){
  return function(){
    alert('you clicked' + i);
  }
}

$(document).ready(function(){
  for(var i = 0; i <p>在此更新版本中，在循环内创建回调函数。此函数捕获“i”的当前值，确保单击元素时显示正确的索引。</p><h3 id="利用-ES-的-let-关键字">利用 ES6 的 let 关键字</h3><p>如果 ES6 语法可用，我们可以使用let 关键字可以更简洁地实现相同的结果：</p><pre class="brush:php;toolbar:false">for(let i = 0; i <p>let 关键字确保 'i' 的作用域是本地的循环，避免关闭问题并在每个元素激活时显示正确的点击索引。</p>

以上是在 JavaScript 循环中分配点击处理程序时如何避免闭包问题？的详细内容。更多信息请关注PHP中文网其他相关文章！