当前位置：首页 > jquery

jquery获取单选框的值

2026-02-04 07:09:29jquery

获取单选框的值

使用jQuery获取单选框（radio button）的值可以通过以下几种方法实现：

方法一：使用:checked选择器

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

radioName需要替换为实际的单选框组名称。如果未选中任何选项，selectedValue将为undefined。

方法二：遍历单选框组

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

这种方法适用于需要额外处理每个单选框的情况。

方法三：直接获取选中项的值

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

与val()类似，但使用attr('value')获取值。

注意事项

确保单选框组具有相同的name属性。
在DOM加载完成后执行代码，可以将代码放在$(document).ready()中。
如果单选框的值是动态生成的，确保在获取值之前已经正确加载。

示例代码

$(document).ready(function() {
    $('#getValueBtn').click(function() {
        var selectedValue = $('input[name="radioGroup"]:checked').val();
        alert(selectedValue);
    });
});

HTML部分：

jquery获取单选框的值

<input type="radio" name="radioGroup" value="1"> Option 1
<input type="radio" name="radioGroup" value="2"> Option 2
<button id="getValueBtn">Get Value</button>