jQuery 设置复选框 - Javascript

本文将介绍如何使用jQuery来设置和操作HTML复选框。

1. 使用prop()方法来设置复选框状态

jQuery的prop()方法是用来设置或者获取HTML元素的属性值。对于复选框来说，可以使用prop()方法来设置其checked属性值来切换复选框的选中状态。

以下是设置复选框为选中状态的示例代码：

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

要将复选框设置为未选中状态，可以将第二个参数改为false：

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

2. 使用attr()方法来设置复选框状态

除了使用prop()方法，还可以使用attr()方法来设置复选框的checked属性值。attr()方法是jQuery用来获取和设置HTML元素属性的方法。

以下是使用attr()方法设置复选框状态的示例代码：

$('#checkboxId').attr('checked', 'checked');

要将复选框设置为未选中状态，可以移除checked属性：

$('#checkboxId').removeAttr('checked');

3. 使用val()方法来获取复选框的值

如果需要获取复选框的值，可以使用val()方法。注意，复选框可以有多个选中的值，所以val()方法获取的是一个数组。

以下是获取复选框值的示例代码：

var values = $('input[name="checkboxName"]:checked').map(function() {
    return $(this).val();
}).get();

4. 使用prop()方法来切换复选框状态

如果需要切换复选框的选中状态，可以利用prop()方法来实现。

以下是切换复选框状态的示例代码：

$('#checkboxId').prop('checked', function(index, value){
    return !value;
});

以上就是使用jQuery设置和操作复选框的方法。希望对你有帮助！