Question

如果选择了无线电表单中的选项，我正试图弄清楚如何检查和写入控制台。即使选中了正确的选项，我也会继续“未选中”。有任何想法吗？我更喜欢一种不包含JQuery的解决方案，因为我学习HTML和JavaScript。

谢谢！

<body>
<form id="office">
    <label id="ques1"> question 1</label><br/>
        <div class="q1 wrong q1a1"><input type="radio" name="question1"    value="q1a1" /> Answer1 <br/></div>
        <div class="q1 wrong q1a2"><input type="radio" name="question1" value="q1a2" /> Answer2 <br/></div>
        <div class="q1 wrong q1a3"><input type="radio" name="question1" value="q1a3" /> Answer3 <br/></div>
        <div class="q1 right q1a4"><input type="radio" name="question1" value="q1a4" /> Answer4 <br/></div>

            <br/><br/>

     <input type="submit" id="submit" name="submitAnswers" value="Submit Your Answers" onclick="checkFunction()" />


</form>


<script type="text/javascript">

window.onload = function() {

 document.getElementById('submit').onclick = function() {
if (document.querySelector('.q1 wrong q1a1').checked == true) {
  console.log('checked');
} else {
  console.log('not checked');
}
};
};
</script>
</body>

Answer 1

您正在检查是否已选中<div>，而不是单选按钮。

更改此行：

if (document.querySelector('.q1 wrong q1a1').checked == true) {

类似于：

if (document.querySelector('input[type=radio][name=question1]').checked == true) {

Answer 2

您传递给querySelector功能的选择器出现轻微错误。 div中的每个类名都应该以{{1}}为前缀选择器应如下.。然后你可以查找该div内部的输入.q1.wrong.q1a1

.q1.wrong.q1a1 input

从单选按钮获取数据

2 个答案: