在HTML表单测验上执行用户回答订单

Question

我正在寻找一种方法来强制HTML表单测验的回答顺序。这是相对直接的，我想 - 我只是想让用户被迫按顺序回答问题。

这里是一个编码例如：

<form method="post"> 

Answer the Questions! 

<P id="question1" onclick="showQuestion('question2')" >1. The word which means "house" is:<BR> 
<input type="radio" required="required" name="1.The word which means house is" value="maison">maison<BR> 
<input type="radio" name="1.The word which means house is" value="quatre">quatre<BR> 
<input type="radio" name="1.The word which means house is" value="soleil">soleil<BR> 
<input type="radio" name="1.The word which means house is" value="poisson">poisson<BR> 
</p> 

<P id="question2" style="display:none;" onclick="showQuestion('question3')" >2. The word which means "fish" is:<BR> 
<input type="radio" required="required" name="2. The word which means fish is" value="maison">maison<BR> 
<input type="radio" name="2. The word which means fish is" value="valise">valise<BR> 
<input type="radio" name="2. The word which means fish is" value="soleil">soleil<BR> 
<input type="radio" name="2. The word which means fish is" value="poisson">poisson<BR> 
</p> 

<P id="question3" style="display:none;">3. The word which means "suitcase" is:<BR> 
<input type="radio" name="3. The word which means suitcase is" value="renard">renard<BR> 
<input type="radio" name="3. The word which means suitcase is" value="valise">valise<BR> 
<input type="radio" name="3. The word which means suitcase is" value="soleil">soleil<BR> 
<input type="radio" name="3. The word which means suitcase is" value="poisson">poisson<BR> 
</p> 

</form> 

这是一个回答后，将显示下一个问题的功能，但是我真正想要做的是显示所有的3个问题，并拥有所需的验证失败如果用户不按顺序回答问题。

<script> 
window.showQuestion = function (val){ 
    var x = document.getElementById(val); 
    x.style.display = 'inline'; 
} 
</script> 

Answer 1

如果你正在寻找的CSS有条件的表单字段我的建议是看看这个PEN.

，或者你可以在JS这样定义。

var selected = $("#question1 option:selected").val(); 

并改变这样的选项。

<option value="1">Option 1</option> 
<option value="2">Option 2</option>