Question

我有一组单选按钮，只能选择一个，并记录其值。我在此link中运行了以下代码，但出现undefined错误：

<!DOCTYPE html>
<html>
<body>

<td class="tg-031e"><input type="radio" name="ribbon_1" id="ribbon_1_1" value="1" size="15" />1</td>
<td class="tg-031e"><input type="radio" name="ribbon_1" id="ribbon_1_2" value="5" size="15" />2</td>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
    var x = document.getElementsByName('ribbon_1').value;
    document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

如何获得正确的值？

Answer 1

getElementsByName()因为名称暗示返回一个元素数组，所以你必须遍历它们并找出哪一个被检查

＆＃13;

function myFunction() {
    var els = document.getElementsByName('ribbon_1');
    for (var i = 0; i < els.length; i++) {
        if (els[i].checked) {
            document.getElementById("demo").innerHTML = els[i].value;
        }
    }
}

＆＃13;

<table>
  <tr>
    <td class="tg-031e"><input type="radio" name="ribbon_1" id="ribbon_1_1" value="1" size="15" />1</td>
    <td class="tg-031e"><input type="radio" name="ribbon_1" id="ribbon_1_2" value="5" size="15" />2</td>
  </tr>
</table>
<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

＆＃13;

Answer 2

以下脚本检查所有单选按钮的名称＆＃34; ribbon_1＆＃34;个别。但是你的脚本＆＃34; getElementsByName（＆＃34; ribbon_1＆＃34;）＆＃34;返回单选按钮的集合。所以它返回Undefined。

 function myFunction() {
            var inputs = document.getElementsByName("ribbon_1");
            for (var i = 0; i < inputs.length; i++) {
              if (inputs[i].checked) {
                 document.getElementById("demo").innerHTML =inputs[i].value;
              }
            }

如何记录一组具有相同名称但不同ID的单选按钮的值？

2 个答案:

尝试this。