当前位置：首页 > jquery

jquery获取radio选中的值

2026-01-13 14:50:39jquery

获取radio选中的值

使用jQuery获取被选中的radio按钮的值可以通过以下几种方法实现：

方法1：使用:checked选择器

var selectedValue = $('input[name="radioName"]:checked').val();

这里的radioName需要替换为实际的radio按钮组的name属性值。如果没有任何radio被选中，selectedValue会是undefined。

方法2：遍历radio按钮组

var selectedValue;
$('input[name="radioName"]').each(function() {
    if ($(this).is(':checked')) {
        selectedValue = $(this).val();
        return false; // 退出循环
    }
});

这种方法通过遍历所有radio按钮来查找被选中的项。

方法3：使用filter方法

var selectedValue = $('input[name="radioName"]').filter(':checked').val();

注意事项

确保radio按钮组有相同的name属性值
在处理前检查是否有选中的radio按钮
动态生成的radio按钮需要事件委托来处理选择变化

示例HTML

<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female

获取选中值的完整示例

jquery获取radio选中的值

$('button').click(function() {
    var gender = $('input[name="gender"]:checked').val();
    if (gender) {
        console.log('Selected gender:', gender);
    } else {
        console.log('No gender selected');
    }
});