单击单选按钮时,我很难弄清楚如何仅获取问题2和问题4的文本。例如,如果我在问题2中单击Java,在问题4中单击Python,则结果应显示在控制台Java和Python中,有人可以帮我吗?我对此深感困惑,不胜感激。
function answers() {
var q = document.querySelectorAll('.question');
[...q].forEach(c => {
if (c.checked) {
console.log(c);
}
})
}
<label>Question 1</label>
<input type="radio" id='questiona' class="question" name="question" value="1"><label for="questiona">a) HTML</label>
<input type="radio" id='questionb' class="question" name="question" value="2"><label for="questionb">b) HTML5</label>
<input type="radio" id='questionc' class="question" name="question" value="3"><label for="questionc">c) XHTML</label>
<br/>
<label>Question 2</label>
<input type="radio" id='question2a' class="question" name="question2" value="1"><label for="question2a">a) Java</label>
<input type="radio" id='question2b' class="question" name="question2" value="2"><label for="question2b">b) CSS</label>
<input type="radio" id='question2c' class="question" name="question2" value="3"><label for="question2c">c) JavaScript</label>
<br/>
<label>Question 3</label>
<input type="radio" id='question3a' class="question" name="question3" value="1">a)PASCAL</label>
<input type="radio" id='question3b' class="question" name="question3" value="2">b) COBOL</label>
<input type="radio" id='question2c' class="question" name="question3" value="3">c) Assembly</label>
<br/>
<label>Question 4</label>
<input type="radio" id='question4a' class="question" name="question4" value="1"><label for="question4a">a) Python</label>
<input type="radio" id='question4b' class="question" name="question4" value="2"><label for="question4b">b) C#</label>
<input type="radio" id='question4c' class="question" name="question4" value="3"><label for="question4c">c) Typscript</label>
<br/>
<a href="#" onclick="answers()">Submit</a>
您可以从以下位置更改console.log
console.log(c);
至:
console.log(c.nextElementSibling.innerText);
.nextElementSibling将寻找下一个元素(在这种情况下为标签)
下一个函数.innerText将在此标签中获取文本。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句