Question

如何使用 javascript 获取单选按钮的值

2010-09-23

8488

javascript html

我需要使用 javascript 获取单选按钮的值

我有一个名为 selection 的单选按钮组

<input type="radio" name="selection" id="selection" value="allClients" checked="checked" />All Clients<br />
          <input type="radio" name="selection" id="selection1" value="dateRange" />Date Range between

我使用 javascript 将值传递给另一个页面

onclick="do_action1('liveClickCampaigns','contract_type='+document.getElementById('contract_type').value+'&beginDate='+document.getElementById('beginDate').value+'&endDate='+document.getElementById('endDate').value+'&selection1='+document.getElementById('selection1').value+'&selection='+document.getElementById('selection').value,'content');" type="button">

document.getElementById('selection').value 需要获取值，但即使选择了第二个单选按钮，它仍会返回第一个单选按钮的值。单选按钮组不在表单内

Answer 1

使用:

function getRadioValue(name) {
    var group = document.getElementsByName(name);

    for (var i=0;i<group.length;i++) {
        if (group[i].checked) {
            return group[i].value;
        }
    }

    return '';
}

应用程序:

var selectedValue = getRadioValue('selection');

演示:

http://www.jsfiddle.net/tqQWT/

Answer 2

尽管 Matt 的解决方案非常完美，解决了您的眼前问题，但如果您需要频繁查询 DOM，我还是建议您开始研究 JavaScript 库，例如 JQuery。

使用 JQuery，您的解决方案只需一行：

var selectedValue = $("input[name=selection]:checked").val();

Answer 3

<纯 javascript:

var selectedValue = document.querySelector('input[name=selection]:checked').value;

Bernhard Wagner

2021-03-18