ASP.NET中jQuery复选框全选按钮仅生效两次问题求助

核心问题原因 #

你用attr()方法操作复选框的checked状态是错误的。attr()仅针对元素初始HTML属性，当复选框状态通过用户交互或JS修改后，DOM的checked状态（属于DOM属性）和HTML的checked属性会脱节，后续attr('checked')无法获取真实的当前状态，导致两次点击后逻辑彻底失效。

修复代码 #

把selectAll函数里的attr()替换成prop()，这是jQuery操作DOM状态属性的正确方法：

function selectAll(idOfButton) {
    var className = '.rowCounter' + idOfButton;
    
    $(className).each(function () {
        // 用prop()操作checked状态
        $(this).prop('checked', !$(this).prop('checked'));
    });
}

可选优化（更直观的全选/反选逻辑） #

如果想让按钮行为更清晰（先全选，再反选，循环），可以先判断当前是否所有复选框都已选中，再统一设置状态：

function selectAll(idOfButton) {
    var className = '.rowCounter' + idOfButton;
    var $checkboxes = $(className);
    // 判断是否所有复选框都已选中
    var allChecked = $checkboxes.filter(':checked').length === $checkboxes.length;
    
    // 统一设置所有复选框的状态
    $checkboxes.prop('checked', !allChecked);
}

额外验证点 #

• 确认生成的复选框类名正确：检查页面HTML，确保每个复选框的class包含rowCounter{i}（i为对应按钮的@i值）
• 按钮的onclick绑定正确：确认按钮生成的selectAll(@i)里的@i值和对应复选框的类名后缀一致

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