jquery - jQuery中缺少参数

Question

我有这样的jquery代码

HTML : 
<table class="display">
  <tr>
    <td style="vertical-align:top;">
    <table class="display">
      <thead>
        <tr>
          <td><label><input type="checkbox" class="menu_3"/> menu 3</label></td>
        </tr>
      </thead>
    </table>
    <table class="display table-hover">
      <tbody>
            <tr>
            <td><label><input type="checkbox" class="submenu_3"/> submenu 3</label></td>
        </tr>
                <tr>
            <td><label><input type="checkbox" class="submenu_3"/> submenu 3</label></td>
        </tr>
              </tbody>
    </table>
    </td>
</td>
</tr>
</table>
JQUERY
for(i=1;i<=6;i++){
        $(".menu_"+i).change(function(){
            $(".submenu_"+i).attr("checked", this.checked);
        });
    }

我想检查menu 3，然后也都submenu 3检查了，不知何故它不起作用，因为 i缺少参数..

我不知道发生了什么。。

帮帮我。。

Answer 1

它应该是

for(i=1;i<=6;i++){
    (function(it){
        $(".menu_"+it).change(function(){
            $(".submenu_"+it).prop("checked", this.checked);
        });
    })(i)
}

问题是闭包变量的使用i，也准备好了这个问题的答案

Answer 2

您可以使用选择器开始选择所有.menu_*元素，然后slice()获取数字以选择相关.submenu_*元素等。无需循环：

$('[class^="menu_"]').on('change', function(){
    $(".submenu_" + this.className.slice(-1)).prop("checked", this.checked);
});

小提琴