Javascript 表单测验验证收音机、文本、选择_Javascript_Html

Javascript 表单测验验证收音机、文本、选择

javascript html

Javascript 表单测验验证收音机、文本、选择,javascript,html,Javascript,Html,我做了一个三个问题的测验。我只是想不出我需要使用的其余Javascript代码。提交测验后，它需要验证所有问题是否都有答案我不想使用alert或prompt说你没有做这个或那个->我想在旁边显示一个红色星号。回答后，我希望它显示正确答案的数量。例：我的三分之二正确。它将显示我得到了2个权利我想使用appendChild这里是我如何设置到目前为止： <!DOCTYPE html> <html> <head> <title>Quiz</title

我做了一个三个问题的测验。我只是想不出我需要使用的其余Javascript代码。提交测验后，它需要验证所有问题是否都有答案我不想使用alert或prompt说你没有做这个或那个->我想在旁边显示一个红色星号。回答后，我希望它显示正确答案的数量。例：我的三分之二正确。它将显示我得到了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>

我刚才看了一下：为表单指定name属性，并为输入字段指定name属性，然后可以执行var a=document.forms[form][ansu 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++
}