点击复选框批量禁用并取消选中其他复选框问题求助

你的问题核心是操作对象错误——你给#reassignChecks这个div设置了checked属性，但div本身没有这个属性，应该直接操作它内部的所有复选框元素。另外，处理复选框的选中/禁用状态时，jQuery推荐用prop()方法而非attr()，前者更适合处理DOM元素的布尔属性。

修改后的jQuery代码： #

function NoInterest(cb) {
    // 精准选中目标区域内的所有复选框
    const targetCheckboxes = $('#reassignChecks input[type="checkbox"]');
    
    if (cb.checked) {
        $('#reassignChecks').addClass('disableSection');
        // 同时完成禁用和取消选中操作
        targetCheckboxes.prop('disabled', true).prop('checked', false);
    } else {
        $('#reassignChecks').removeClass('disableSection');
        // 恢复复选框的可用状态（不需要强制选中，除非有特殊需求）
        targetCheckboxes.prop('disabled', false);
        // 若需恢复之前的选中状态，需提前保存状态，示例：
        // targetCheckboxes.each(function() {
        //     $(this).prop('checked', $(this).data('prevChecked'));
        // });
    }
}

关键修改点： #

• 用$('#reassignChecks input[type="checkbox"]')定位到真正需要操作的复选框元素，而非父级div
• 使用prop()方法设置checked和disabled属性，这是jQuery处理复选框状态的标准方式
• 禁用状态下同时完成「取消选中」和「禁用交互」两个需求，逻辑更紧凑
• 取消勾选时仅恢复禁用状态，移除了原代码中强制设为checked: true的不合理逻辑（若需恢复之前选中状态，可参考注释里的状态保存方案）

补充提示： #

如果disableSection类仅做视觉上的禁用样式，一定要通过prop('disabled', true)真正禁用复选框的交互功能，确保用户既无法看到选中状态，也不能点击操作。

内容的提问来源于stack exchange，提问作者rimi