当前位置：首页 > jquery

jquery选中radio

2026-04-08 04:03:19jquery

使用 jQuery 选中 radio 按钮

通过 jQuery 选中 radio 按钮可以使用多种方法，具体取决于需求和场景。以下是几种常见的方法：

通过属性选择器选中特定值的 radio 按钮

$('input[name="radioName"][value="radioValue"]').prop('checked', true);

name 属性指定 radio 组的名称，value 属性指定具体的 radio 按钮值。prop('checked', true) 将选中匹配的 radio 按钮。

通过 ID 选中特定的 radio 按钮

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

如果 radio 按钮有唯一的 ID，可以直接通过 ID 选择器选中并设置 checked 属性。

选中 radio 组中的第一个或最后一个按钮

$('input[name="radioName"]:first').prop('checked', true);
$('input[name="radioName"]:last').prop('checked', true);

使用 :first 或 :last 选择器可以选中 radio 组中的第一个或最后一个按钮。

通过索引选中 radio 组中的特定按钮

$('input[name="radioName"]').eq(index).prop('checked', true);

eq(index) 方法可以选中 radio 组中指定索引的按钮，索引从 0 开始。

使用 `attr` 方法（旧版 jQuery）

$('input[name="radioName"][value="radioValue"]').attr('checked', 'checked');

在旧版 jQuery 中，可以使用 attr 方法设置 checked 属性，但推荐使用 prop 方法。

示例代码

以下是一个完整的示例，展示如何通过按钮点击选中特定的 radio 按钮：

jquery选中radio

<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female
<button id="selectMale">Select Male</button>
<button id="selectFemale">Select Female</button>

<script>
$(document).ready(function() {
    $('#selectMale').click(function() {
        $('input[name="gender"][value="male"]').prop('checked', true);
    });
    $('#selectFemale').click(function() {
        $('input[name="gender"][value="female"]').prop('checked', true);
    });
});
</script>