jQuery如何获取已选中radio单选按钮值？val不是函数报错如何解决

报错原因 #

$("input[type='radio']")返回的是jQuery封装的类数组对象，当你通过数组下标radios[i]取值时，拿到的是原生DOM元素，而非jQuery对象。val()是jQuery提供的方法，原生DOM元素没有该方法，因此触发类型错误。

解决方法 #

有三种常用的处理方案，可按需选择：

• 方案1：将原生DOM元素重新包装为jQuery对象再调用val()
  仅需修改报错行：

  radioChecked.push($(radios[i]).val());
  

• 方案2：直接使用原生DOM的value属性取值，不依赖jQuery方法，性能更高
  修改报错行：

  radioChecked.push(radios[i].value);
  

• 方案3：直接用jQuery内置语法简化逻辑，无需手动写遍历
  整个函数可以简化为：

  function radiolist() {
    const radioChecked = $("input[type='radio']:checked").map(function() {
      return $(this).val();
    }).get();
    alert(radioChecked);
  }
  

  该写法直接用:checked筛选出已选中的单选框，通过map方法遍历取值，最后调用get()把jQuery类数组转为普通JS数组即可。

内容的提问来源于stack exchange，提问作者topcool