Question

我正在尝试使用HTML和Javascript来访问单选按钮的值来进行简单的测验，但它似乎不起作用。这是我的代码：

function check() {
var a = document.getElementById("test").value
if (a === "one") {
alert("Correct!")
} else {
alert("Wrong!")
}
}

<h1><center>Simple Quiz</center></h1>
<br>
1) What is 1 + 1?
<br>
<form>
  <input type="radio" name="one" id="test" value="one">1<br>
  <input type="radio" name="one" id="test" value="two">2<br>
  <input type="radio" name="one" id="test" value="three">3<br>
  <button onclick="check()">Check</button>
</form>

总是说“正确！”即使不是。有谁知道如何解决这个问题？

Answer 1

您遗失的一些要点：

整个页面上的ID必须唯一
要检查单选按钮是否已选中，请使用其checked属性

function check() {
  var two = document.getElementById("two");
  if (two.checked) {
    alert("Correct!")
  } else {
    alert("Wrong!")
  }
}

<h1>
  <center>Simple Quiz</center>
</h1>
<br> 1) What is 1 + 1?
<br>
<form>
  <input type="radio" name="one" id="one" value="one">1<br>
  <input type="radio" name="one" id="two" value="two">2<br>
  <input type="radio" name="one" id="three" value="three">3<br>
  <button onclick="check()">Check</button>
</form>

Answer 2

首先，您不能在多个元素上使用相同的 id 。 Make为您的元素提供唯一的 id ，如果您需要为它们提供相同的样式，则可以使用class代替。

您应该检查单选按钮是否为value，而不是检查单选按钮的checked。

看一下下面的例子。

＆＃13;

function check() {
  if (document.getElementById('test2').checked) {
    alert('correct');
  } else {
    alert('wrong');
  }
}

＆＃13;

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Example</title>
</head>
<body>
  <h1><center>Simple Quiz</center></h1>
<br>
1) What is 1 + 1?
<br>
<form>
  <input type="radio" name="one" id="test1" value="one">1<br>
  <input type="radio" name="one" id="test2" value="two">2<br>
  <input type="radio" name="one" id="test3" value="three">3<br>
  <button onclick="check()">Check</button>
</form>
</body>
</html>

＆＃13;

Answer 3

你不应该定义多个具有相同ID的元素，这是一个不好的做法，你可以改进你的代码function check() { for (elemnt of document.getElementByClassName('test') ) { if (element.checked ) alert('correct'); else alert ("incrrect");}} 他们在HTML中你可以做到这一点 <input type="radio" class="test" value="1">

<input type="radio" class="test" value="2"> <input type="radio" class="test" value="3">

如何访问单选按钮的值

3 个答案: