在HTML表单测验上执行用户答案顺序

时间:2017-04-14 02:50:39

标签: html

我正在寻找一种强制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>

1 个答案:

答案 0 :(得分:1)

如果您正在寻找带有CSS的条件表单字段,我建议您查看 PEN.

或者您可以像这样在JS中定义。

TestBed.configureTestingModule({
   declarations: [ SidebarDatepickerComponent ],
   imports: [DatepickerModule.forRoot(), FormsModule]
})

并更改此类选项。

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