我做了一个3个问题测验。我只是无法弄清楚我需要使用的其余Javascript代码。一旦提交测验,它需要验证所有问题都有答案(我不想使用警报或提示说你没有做到这一点或那个 - >我想用它来样式,就像在它旁边显示一个红色星号。之后它回答我希望它显示正确答案的数量。例如:我得到3分中的2分。它会显示我2分右(我想使用appendChild)这是我到目前为止设置的方式:
<!DOCTYPE html>
<html>
<head>
<title>Quiz</title>
<meta charset="utf-8">
</head>
<body>
<form action="" method="post" onsubmit="return FormValidation()";>
<div class="question1">
1) What is your first name?<br/>
<input type="text" id="firstname" name="name"/><br/><br/>
</div>
<div class="question2">
2) What is 5 + 5?<br/><br/>
<input type="radio" id="10" name="10"/>10
<input type="radio" id="10" name="9"/>9
<input type="radio" id="10" name="11"/>11
</div><br/><br/>
<div class="question3">
3) What happened a long time ago in a galaxy far far away?<br/><br/>
<select>
<option value="hp">Harry Potter</option>
<option value="twi">Twilight</option>
<option value="star">Star Wars</option>
</select>
</div><br/><br/>
</form>
<script>
function FormValidation(){
var fn=document.getElementById('firstname').value;
if(fn == ""){
document.getElementById('firstname').style.borderColor = "red";
return false;
}else{
document.getElementById('firstname').style.borderColor = "green";
}
}
</script>
</body>
</html>
答案 0 :(得分:0)
我只是看着这个:javascript validation for empty input field
为表单指定name属性,输入字段也是name属性,然后您可以执行var a=document.forms["Form"]["ans_a"].value;
之类的操作并使用
if(a===null){
//apply your style with a red asterisk here, or append a red asterisk element
}
您还可以确定他们使用此方法获得了多少,
var expectedAnswer1 = "George Washington"
if(a===expectedAnswer1){
correctAnswerCount++
}