正确的 jQuery 获取 radio 选中值的写法

如何正确的获取 radio 的值。

November 28, 2016 - 1 minute read -
jquery

先看下面一段代码

<label><input type="radio" name="radio" value="1" checked="true" /> raio1</label>
<label><input type="radio" name="radio" value="2" /> radio2 </label>
<label><input type="radio" name="radio" value="3" /> radio3 </label>
<input type="button" value="ok" onclick="doChecked()"/>

<script language="JavaScript">
function doChecked(){
  alert($(":radio[checked]").val());
}
</script>

网上流行的说法就是

$(":radio[checked]").val()

能取到选中项的 value,但通过测试后发现,只有 IE 下有效,在 FireFox 与 Chrome 中不论选中哪一项,或不选,取到的值都是第一项的 value

正解

$(":radio:checked").val()

扩展

同样这种写法也可以用于 checkbox 上。