Radio单选组的第二个元素为当前选中值，jQuery该怎么去取？

八股文_JQuery面试题 0 20

参考回答

要获取 Radio 单选组的第二个选中的元素，使用 jQuery 可以这样写：

$('input[name="yourRadioName"]:eq(1):checked').val();

这里 yourRadioName 是你单选按钮组的 name 属性值。eq(1) 选择第二个单选按钮（索引从 0 开始），:checked 选择选中的按钮，.val() 获取该按钮的值。

详细讲解与拓展

选择器说明:
- input[name="yourRadioName"] 选择具有指定 name 属性的所有 <input> 元素，这些输入元素应该是属于同一组的单选按钮。
- eq(1) 是 jQuery 的方法，它选择集合中的第二个元素。jQuery 中的选择器索引是从 0 开始的，所以 eq(1) 会选择第二个元素。
- :checked 是一个伪类，用来筛选出当前被选中的单选按钮（或者复选框）。它确保我们只能获得被选中的那个元素。
- .val() 获取选中的单选按钮的值。

示例:
假设你的 HTML 代码如下：

<input type="radio" name="yourRadioName" value="option1"> Option 1
<input type="radio" name="yourRadioName" value="option2"> Option 2
<input type="radio" name="yourRadioName" value="option3"> Option 3

如果第二个单选按钮被选中（Option 2），那么 $('input[name="yourRadioName"]:eq(1):checked').val(); 会返回 "option2"。

其他考虑:
- 获取已选中的值：如果你想要获取任何被选中的单选按钮的值，而不是只关注第二个，可以使用以下代码：
```
$('input[name="yourRadioName"]:checked').val();
```
  这样，它会返回所有选中的单选按钮中的值，但只会有一个选项被选中。

无选中时：如果没有单选按钮被选中，$('input[name="yourRadioName"]:eq(1):checked') 会返回一个空的 jQuery 对象，这时调用 .val() 将返回 undefined，所以你可能需要检查是否有选中项。

选择第二个元素:
如果你只想获取 Radio 组中第二个单选按钮的值，无论它是否被选中，可以去掉 :checked，直接这样：
```
$('input[name="yourRadioName"]:eq(1)').val();
```
这将返回第二个单选按钮的值，哪怕它没有被选中。

总结

使用 $('input[name="yourRadioName"]:eq(1):checked').val(); 可以获取 Radio 单选组中第二个被选中的元素的值。
通过 :checked 伪类，你可以确保只获取已选中的单选按钮。
如果没有被选中的单选按钮，val() 返回 undefined。

发表评论取消回复

后才能评论