Question

我是Javascript方面的初学者。

Stackoverflow中有很多类似的问题。但这些都没有解决我的这个小例子。

我喜欢在默认情况下仅使用javascript选择特定的单选按钮。

我在本地主机中尝试了以下简单示例。但它没有用。它正在选择最后一个单选按钮

<html>
  <head>
    <title>JS Test</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
  </head>
  <body>
        <div></div>
        <div>
            <form name="myform" action="">
                <label for="name">Name</label>
                    <input type="text" name="name"></input>
                <br>
                    <label for="radio_value">Select Position</label>
                    <input type="radio" name="radio_value" value="First">First</input>
                    <input type="radio" name="radio_value" value="Second">Second</input>
                    <input type="radio" name="radio_value" value="Third">Third</input>
                    <input type="radio" name="radio_value" value="Fourth">Fourth</input>
                    <input type="radio" name="radio_value" value="Fifth">Fifth</input>
                <br>
                    <input type="submit" name="form_submit" value="Submit"></input>
            </form>
        </div>
        <script type="text/javascript">
            var rates = document.getElementsByName('radio_value');
            var rate_value;
            for(var i = 0; i < rates.length; i++){
                document.getElementsByName('radio_value')[i].checked=true;
            }
    </script>
  </body>
</html>

查看JSFIDDLE 对不起朋友，我无法为每个单选按钮添加ID。

Answer 1

您可以使用：document.getElementById("First")并将checked设置为true。

document.getElementById("First").checked = true;

[更新] 尝试类似：

var radios = document.getElementsByTagName('input');
for (var i = 0; i < radios.length; i++) {
    if (radios[i].type === 'radio') radios[i].checked = true;
}

Answer 2

你可以用jquery做到这一点非常简单：

$("#First").attr('checked', 'checked');

FIDDLE

<强>更新

然后使用nash_ag＆＃39的vanilla javascript，这是最简单的方法：

document.getElementById("First").checked = true;

NEW FIDDLE

Answer 3

我找到了解决问题的方法。

document.getElementsByName('radio_value')[1].checked=true;

我的更新JS FIDDLE

Answer 4

getElementsByName为您提供匹配元素的数组。通过DOM中的索引访问特定元素，该索引应与数组中的索引相同。示例中的代码遍历数组中的每个元素，检查它并同时取消选中先前检查的元素（这是单选按钮组的行为）。

使用Javascript选择广播组中的任何一个单选按钮

4 个答案: