javascript中的一种奇怪行为，涉及懒散

Kind of odd behavior in javascript involving lazyness

本文关键字：一种 javascript      更新时间：2023-09-26

javascript中奇怪的"懒惰"行为。这台运行良好：

$(document).on("change", "#dropdown-menu-category-chk", function(){
  $("#dropdown-menu-category input[type='checkbox']").prop('checked', this.checked);
 });
$(document).on("change", "#dropdown-menu-category2-chk", function(){
   $("#dropdown-menu-category2 input[type='checkbox']").prop('checked', this.checked);
 });
$(document).on("change", "#dropdown-menu-category3-chk", function(){
  $("#dropdown-menu-category3 input[type='checkbox']").prop('checked', this.checked);
 });
 // and so on....

但是在这个代码中，变量i==5！

function setDropDowns(){
  var idList = ['category', 'category2', 'category3', 'category4', 'category5']
  for(var i = 0; i < idList.length; i++){
    $(document).on("change", "#dropdown-menu-"+idList[i]+"-chk", function(){
      $("#dropdown-menu-" +idList[i] +" input[type='checkbox']").prop('checked', this.checked);
        debugger; // i == 5; idList[i] === undefined
    });
  }
}

即使我说

for(var i = 0; i < idList.length; i++){
  var id = dropDownCheckBoxItemList[i];
  $(document).on("change", "#dropdown-menu-"+id+"-chk", function(){

它不起作用，因为在执行代码时id将等于'category5'！

如何使用循环使其工作？我不想打破DRY的规则。

您需要在循环的每次迭代中捕获i的值。您可以通过引入一个具有立即调用的函数表达式的新作用域来实现这一点：

for(var i = 0; i < idList.length; i++) {
    (function (i) {
        $(document).on("change", "#dropdown-menu-"+idList[i]+"-chk", function() {
            // etc...
        });
    }(i));
}
相关文章：