Javascript onchange只检测div的第一个复选框

这是分区

    <div class="col-lg-4 pre-scrollable" id="all-menus-div">
        <h3 class="text-center">Tum menu listesi</h3>
        <div class="list-group" id="all-menus-checkboxes" th:each="menu : ${allMenusList}">
            <input th:id="${menu.id}" th:text="${menu.item}" th:value="${menu.item}" type="checkbox"/>
        </div>
        <button class="btn btn-success" disabled id="add-menus-to-role-btn" type="submit">Ekle</button>
    </div>

    <button class="btn btn-success" id="update-menus-for-role-btn" type="submit">Rolu guncelle</button>
</div>

onchange事件必须绑定到

上

绑定事件必须附加到

之后

但您的

与动态生成类似，建议使用“事件委派”：

将类添加到

使用事件委派

<script>
  $('#all-menus-div').on('change', '.all-menus-checkboxes', function () { ... }
</script>

$（'#所有菜单div'）。在（'change'，'上。所有菜单复选框'，函数（）{…}

onchange事件必须绑定到

上

绑定事件必须附加到

之后

但您的

与动态生成类似，建议使用“事件委派”：

将类添加到

使用事件委派

<script>
  $('#all-menus-div').on('change', '.all-menus-checkboxes', function () { ... }
</script>

$（'#所有菜单div'）。在（'change'，'上。所有菜单复选框'，函数（）{…}

试试这个

 $('#all-menus-checkboxes > input[type=checkbox]').on('change', function () { // on change of state
var addButton = document.getElementById('add-menus-to-role-btn');
        lengthOfCheckedAllMenus = $('#all-menus-div :checked').length;
        debugger;
        console.log(" lengthOfCheckedAllMenus: " + lengthOfCheckedAllMenus);

        addButton.disabled = lengthOfCheckedAllMenus <= 0;
    });

$（“#所有菜单复选框>输入[type=checkbox]”）。在（'change'，函数（）{//on状态更改
var addButton=document.getElementById（'add-menus-to-role-btn'）；
lengthOfCheckedAllMenus=$（“#所有菜单分区：选中”）。长度；
调试器；
日志（“lengthOfCheckedAllMenus:+lengthOfCheckedAllMenus”）；
addButton.disabled=lengthOfCheckedAllMenus试试这个

 $('#all-menus-checkboxes > input[type=checkbox]').on('change', function () { // on change of state
var addButton = document.getElementById('add-menus-to-role-btn');
        lengthOfCheckedAllMenus = $('#all-menus-div :checked').length;
        debugger;
        console.log(" lengthOfCheckedAllMenus: " + lengthOfCheckedAllMenus);

        addButton.disabled = lengthOfCheckedAllMenus <= 0;
    });

$（“#所有菜单复选框>输入[type=checkbox]”）。在（'change'，函数（）{//on状态更改
var addButton=document.getElementById（'add-menus-to-role-btn'）；
lengthOfCheckedAllMenus=$（“#所有菜单分区：选中”）。长度；
调试器；
日志（“lengthOfCheckedAllMenus:+lengthOfCheckedAllMenus”）；
addButton.disabled=lengthOfCheckedAllMenus Id需要唯一。请改用类选择器。Id需要唯一。改用类选择器。我在其他div中也有很多输入。因此，我只需要该div。使用css选择器“#所有菜单复选框>输入[type=checkbox]'我在其他div中也有很多输入。因此，我只需要该div。使用css选择器'#所有菜单复选框>输入[type=checkbox]'
 $('#all-menus-checkboxes > input[type=checkbox]').on('change', function () { // on change of state
var addButton = document.getElementById('add-menus-to-role-btn');
        lengthOfCheckedAllMenus = $('#all-menus-div :checked').length;
        debugger;
        console.log(" lengthOfCheckedAllMenus: " + lengthOfCheckedAllMenus);

        addButton.disabled = lengthOfCheckedAllMenus <= 0;
    });