从单选按钮获取数据

我想弄清楚如何选中无线电表格中的选项来检查和写入控制台。即使选中了正确的选项，我总是收到“未选中”。任何想法？我宁愿一个不包含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>

来源

2015-11-25 user3185970

一个在代码中错误的是'document.querySelector（”。Q1错q1a1' ）'将无法访问，它会像'document.querySelector（'.q1.wrong.q1a1'）'，但你想要的是什么？ –

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

改变这一行：

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

喜欢的东西：

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

来源

2015-11-25 14:55:46

...或'document.querySelector（'input [name =“question1”]：checked'）。value;' –

@Pamblam好吧。如果还有其他'.q1a1'，这可能会更好。 –

非常感谢您的回答！我尝试了第一个选项，并得到“无法读取属性”选中“空”。当我尝试“（'input [name =”question1“]：checked'）”我得到了“Uncaught ReferenceError：checkFunction未定义” 任何其他选项？谢谢 – user3185970

你必须要传递到querySelector功能选择略有误差。在div中的每个类名都应该加上前缀. 选择器应该看起来像这样.q1.wrong.q1a1。然后你就可以查找输入那就是div中这样.q1.wrong.q1a1 input

window.onload = function() { 
    document.getElementById('submit').onclick = function() { 
    if (document.querySelector('.q1.wrong.q1a1 input').checked == true) { 
     console.log('checked'); 
    } else { 
     console.log('not checked'); 
    } 
    } 
}

来源

2015-11-25 15:43:46

从单选按钮获取数据

回答

相关问题