jquery选中checkbox

使用 jQuery 选中 checkbox

通过 jQuery 选中 checkbox 有多种方法，具体取决于需求是获取已选中的 checkbox 还是设置 checkbox 的选中状态。

获取选中的 checkbox

使用 :checked 选择器可以获取所有已选中的 checkbox 元素：

var checkedBoxes = $('input[type="checkbox"]:checked');
checkedBoxes.each(function() {
    console.log($(this).val());
});

设置 checkbox 为选中状态

通过 prop() 方法可以设置 checkbox 的选中状态：

$('#checkboxId').prop('checked', true);

如果需要根据条件动态设置选中状态，可以结合其他逻辑：

var shouldCheck = true; // 根据条件设置
$('#checkboxId').prop('checked', shouldCheck);

选中所有 checkbox

如果需要选中页面上的所有 checkbox，可以使用以下代码：

$('input[type="checkbox"]').prop('checked', true);

反选 checkbox

通过遍历所有 checkbox 并取反当前选中状态，可以实现反选功能：

$('input[type="checkbox"]').each(function() {
    $(this).prop('checked', !$(this).prop('checked'));
});

监听 checkbox 选中事件

如果需要监听 checkbox 的选中状态变化，可以使用 change 事件：

$('input[type="checkbox"]').change(function() {
    if ($(this).is(':checked')) {
        console.log('Checkbox is checked');
    } else {
        console.log('Checkbox is unchecked');
    }
});

注意事项

• 使用 prop() 而非 attr() 来操作 checkbox 的选中状态，因为 prop() 更可靠且符合 jQuery 的最新实践。
• 确保 DOM 完全加载后再执行 jQuery 代码，可以将代码包裹在 $(document).ready() 中：

$(document).ready(function() {
    // jQuery 代码
});