如何在 jQuery 中获取选中和未选中的复选框值

在开发 Web 应用程序时，我们通常需要获取复选框的选中状态，以便执行相应的操作。本文将向您介绍如何使用 jQuery 来获取选中和未选中的复选框值。

获取选中的复选框值

要获取选中的复选框值，我们可以使用 :checked 伪类选择器。该选择器仅选择已选中的复选框。

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

// 获取具有 name 属性值为 fruit 的所有选中复选框值
let selectedFruits = $('input[name="fruit"]:checked')
                           .map(function() {
                             return this.value;
                           }).get();

console.log(selectedFruits);

在上面的示例中，selectedFruits 变量将包含所有选中的值。

获取未选中的复选框值

要获取未选中的复选框值，我们可以使用 not() 方法和 :checked 伪类选择器。该选择器仅选择已选中的复选框。

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

// 获取具有 name 属性值为 fruit 的所有未选中复选框值
let unselectedFruits = $('input[name="fruit"]')
                             .not(':checked')
                             .map(function() {
                               return this.value;
                             }).get();

console.log(unselectedFruits);

在上面的示例中，unselectedFruits 变量将包含所有未选中的值。

结论

使用上述 jQuery 代码片段，您可以轻松获取复选框的选中和未选中值。这对于构建 Web 应用程序和表单非常有用。