jquery获取checkbox的值
获取单个checkbox的值
使用jQuery获取单个checkbox的值可以通过选择器选中元素后调用val()方法。假设checkbox的HTML如下：
<input type="checkbox" id="myCheckbox" value="option1">通过ID选择器获取值：
var checkboxValue = $('#myCheckbox').val();获取多个checkbox的选中值
当页面有多个同名checkbox时（例如表单组），可以通过以下方式获取所有被选中的值：
<input type="checkbox" name="colors" value="red"> Red
<input type="checkbox" name="colors" value="green"> Green
<input type="checkbox" name="colors" value="blue"> Blue使用属性选择器结合map()方法：
var selectedValues = $('input[name="colors"]:checked').map(function() {
return $(this).val();
}).get(); // 返回数组 ["red", "green"]等判断checkbox是否被选中
使用prop('checked')或is(':checked')方法检测选中状态：
var isChecked = $('#myCheckbox').prop('checked'); // 返回true/false
// 或
var isChecked = $('#myCheckbox').is(':checked');获取checkbox组选中值的完整示例
$('#submitBtn').click(function() {
var selected = [];
$('input[name="colors"]:checked').each(function() {
selected.push($(this).val());
});
console.log(selected); // 输出选中的值数组
});注意事项
- 未选中的checkbox不会被包含在表单提交数据中
- 使用
:checked选择器时需确保DOM已加载完成，建议将代码放在$(document).ready()中 - 对于动态生成的checkbox，需使用事件委托处理变化事件
