javascript获取选定的html单选按钮输入的值[重复]

Posted 2023-03-05

【中文标题】javascript获取选定的html单选按钮输入的值[重复]

【英文标题】：javascript get value of html radio button input selected [duplicate]

【发布时间】：2016-09-20 00:52:12

【问题描述】：

我有一个像这样的简单表格：

<form id="formSearch">
<label><input type="radio" name="number" value="1">singular</label><br>
<label><input type="radio" name="number" value="2">plural</label><br><br>
<INPUT type="Submit" Value="Show" name="show" ></INPUT>
</form>

我想用 javascript 获取所选按钮的“radio-value”：

var account = document.getElementsByName("number").value;

不要给出正确的答案。如果我给一个陷阱：

alert(account);

结果是：未定义。 不知道伤害在哪里，有谁愿意帮助我，谢谢

【参考方案1】：

使用javascript：

document.querySelector('[name=number]:checked').value;

【参考方案2】：

在 jquery 中，您可以使用选中的属性选择器

$("[name='number']:checked").val()

【参考方案3】：

function test() 
  
  var checkedRadioBtnList=new Array();
  
  var account = document.getElementsByName("number");
  
  for(i=0; i<account.length;i++)  
    if(account[i].checked)      
      checkedRadioBtnList.push(value:account[i].value);
        
  
  
  console.log(checkedRadioBtnList);

<form id="formSearch">
<label><input type="radio" name="number" value="1">singular</label><br>
<label><input type="radio" name="number" value="2">plural</label><br><br>
<INPUT type="Submit" Value="Show" name="show" onclick="test()" ></INPUT>
</form>

getElementsByName 将返回一个数组。

编辑

我只是简单地回答了这个问题，如何使用javascript 获取检查值。

有很多选项可以根据应用程序存储值。我已经改进了我的答案，使用JSON Object 将checked 单选按钮值存储在Array 中。

【讨论】：

但是你怎么知道选择了哪个元素呢？简单地访问第一个收音机不是解决方案。

@RoryMcCrossan 检查我更新的答案。

如果我选择复数，则警报为 false。

@Jitendra Tiwari ：如果只有两个选择（单数和复数），这种方式是正确的，如果有两个以上的选择呢？

@Jai，@agus 我已经更新了我的答案。请查看我对EDIT 部分的评论。