我有一个非常简单的表单,我希望用户能够回答每个问题,如果答案有子问题,子问题将显示何时检查了相应的答案。我是没能让这个工作......
<script>
$(document).ready(function(){
$(".sub-question").hide();
var yes = document.getElementById("#Q4A1");
if(yes.checked){
$(".sub-question").show(200);
}
});
</script>
目前我的yes.checked
条件收到“null”引用错误。
<div class="question-content">
<span>Example text example text</span>
<form id="question-04">
<label><input type="radio" name="question-04" value="yes" id="Q4A1"> Yes</label><br>
<label><input type="radio" name="question-04" value="no"> No</label>
</form>
<div class="sub-question">
<div class="sub-question-content">
<span>Aliquam erat volutpat. Quisque facilisis non mauris non malesuada. Duis in accumsan metus. Ut eget nulla neque?</span>
<form id="subquestion-04">
<label><input type="radio" name="question-04" value="yes"> Yes</label><br>
<label><input type="radio" name="question-04" value="no"> No</label>
</form>
</div>
</div>
</div>
如果答案是肯定的,我想做的就是显示“子问题”。如果可能的话,我宁愿不明确地引用input元素,而是引用表单元素,以防万一“no”有子问题。我想尽可能让它变得动态。感谢您的帮助!
答案 0 :(得分:1)
这是一个有效的jsfiddle
您需要在按钮电台上收听更改事件。
$(document).ready(function(){
$(".sub-question").hide();
$("#Q4A1").change(function () {
$(".sub-question").show(200);
});
});
当然,您可能需要对其进行修改以满足您的需求,但您明白了。 您可以使用javascript在单选按钮上收听更改事件,并在需要时显示子问题。
如果您想对“否”答案做同样的事情,很容易扩展它,但我让你这样做,这就是编程很有趣的原因。