Question

当我要求用户写下他们是否愿意吃饭时，我正在尝试写一个表格。然而，无论他们回答什么，答案都会出现＆＃34;是＆＃34;。这段代码有什么问题？

values.yaml

Answer 1

您错过了name属性，这对于对单选按钮进行分组是必要的：

<input type="radio" name="validate" value="yes">Yes<br>
<input type="radio" name="validate" value="no">No<br>

id必须是唯一的，用这个修复JavaScript函数，结果将是下一个（作为André的答案）：

function eatFood() {
  var radios = document.getElementsByName('validate');

  for (var i = 0, length = radios.length; i < length; i++)
  {
     if (radios[i].checked)
     {
       alert(radios[i].value);
       break;
     }
  }
}

Answer 2

以下是使用JavaScript获取无线电输入值的最简单方法：

function eatFood() {
    var choice = document.querySelector('input[name = validate]:checked').value;
    alert(choice);
}

工作演示：https://codepen.io/andreds/pen/ppQzeL

以下是第二种方式：

function eatFood() {
var radios = document.getElementsByName('validate');

  for (var i = 0, length = radios.length; i < length; i++)
  {
   if (radios[i].checked)
   {
     alert(radios[i].value);
     break;
   }
  }
}

第二种工作演示：https://codepen.io/andreds/pen/XVyrJB

如果您只有两个无线电输入，则第三种方式：

function eatFood() {
  if (document.getElementById('yes').checked) {
    result = document.getElementById('yes').value;
  }
  if (document.getElementById('no').checked) {
    result = document.getElementById('no').value;
  }
  alert(result);
}

第三种工作演示：https://codepen.io/andreds/pen/KZrPVy

警报电台输入表格

2 个答案: