Java 用于计算单选按钮测验结果并忽略文本字段的脚本
Java script to calculate quiz result from radio buttons and ignore text fields
我正在创建一个测试,其中计算结果并给出一个百分比。它在底部显示正确答案。结果可以通过电子邮件发回给我。下面的代码 worked.Excuse 布局,我对此很陌生。
<html><head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="testpageCSS.css" rel="stylesheet" type="text/css">
<script language="JavaScript">
<!--
var numQues = 4;
var numChoi = 4;
var answers = new Array(4);
answers[0] = "33v 1A";
answers[1] = "Climbs from between 8 -12v up to battery Voltage";
answers[2] = "Main power relay stuck open";
answers[3] = "2 Meters";
function getScore(form) {
var score = 0;
var currElt;
var currSelection;
for (i=0; i<numQues; i++) {
currElt = i*numChoi;
for (j=0; j<numChoi; j++) {
currSelection = form.elements[currElt + j];
if (currSelection.checked) {
if (currSelection.value == answers[i]) {
score++;
break;
}
}
}
}
score = Math.round(score/numQues*100);
form.percentage.value = score + "%";
var correctAnswers = "";
for (i=1; i<=numQues; i++) {
correctAnswers += i + ". " + answers[i-1] + "\r\n";
}
form.solutions.value = correctAnswers;
}
// -->
</script>
</head>
<body>
<div id="centerTOP">
<h1> HCA001</h1>
</div>
<div id="center">
<form name="quiz" method="post" action="mailto:myemail"enctype="text/plain">
<h2>First name:</h2>
<input type="text" name="Firstname" value="" style="color: #000000;"
background-color: #d9d9d9;">
<h2>Last name:</h2>
<input type="text" name="Lastname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Trade Partner:</h2>
<input type="text" name="Trade Partner" value="" style="color: #000000; background-color: #d9d9d9;">
<br><br><br>
<p>
<h2>1. What is the output Voltage and Current of the Charger?</h2><br>
<input type="radio" name="q1" value="24v 1A">24v 1A<br>
<input type="radio" name="q1" value="33v 5A">33v 5A<br>
<input type="radio" name="q1" value="24v 5A">24v 5A<br>
<input type="radio" name="q1" value="33v 1A">33v 1A<br><br><br>
<p>
<h2>2. If you were checking the communications voltage for any of the powered options (Auto Hinge, Powered Footplate or Powered Swivel)what would you expect to see?</h2><br>
<input type="radio" name="q2" value="Climbs from between 8 -12v up to battery Voltage">Climbs from between 8 -12v up to battery Voltage<br>
<input type="radio" name="q2" value="Climbs from 4v to Battery Voltage">Climbs from 4v to Battery Voltage<br>
<input type="radio" name="q2" value="24v">24v<br>
<input type="radio" name="q2" value="33v">33v<br><br><br>
<p>
<h2>3. What does it mean if fault code 'E' is displayed on the diagnostic display?</h2><br>
<input type="radio" name="q3" value="Main power relay stuck open">Main power relay stuck open<br>
<input type="radio" name="q3" value="Main power relay welded closed">Main power relay welded closed<br>
<input type="radio" name="q3" value="The main power relay closed early">The main power relay closed early<br>
<input type="radio" name="q3" value="Error">Error<br><br><br>
<p>
<h2>4. What is the minimum length of a Slidetrack rail?</h2><br>
<input type="radio" name="q4" value="2 Meters">2 Meters<br>
<input type="radio" name="q4" value="2.1 Meters">2.1 Meters<br>
<input type="radio" name="q4" value="2.2 Meters">2.2 Meters<br>
<input type="radio" name="q4" value="2.5 Meters">2.5 Meters<br><br><br>
<p>
<input type="button" value="Get score" onClick="getScore(this.form)"><br> <br><br>
<font face="arial" color="#5f5f5f">Score = <input type=text size=15 name="percentage" style="color: #000000; background-color: #d9d9d9;"><br><br>
Correct answers:</font><br>
<textarea name="solutions" wrap="virtual" rows="10" cols="40" style="color: #000000; background-color: #d9d9d9;"></textarea>
<br><br>
<input type="submit" value="Send Form">
<input type="reset" value="Clear Form">
</form>
</div>
</body></html>
然后我需要添加如下文本字段以输入测试用户详细信息,我已将其添加到可提交表单中。现在脚本也尝试使用文本字段来计算分数,这给出了一个不正确的 result.Any 如何更改脚本以仅查看单选按钮输入的想法?
<h2>First name:</h2>
<input type="text" name="Firstname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Last name:</h2>
<input type="text" name="Lastname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Trade Partner:</h2>
<input type="text" name="Trade Partner" value="" style="color: #000000; background-color: #d9d9d9;">
设置类型 属性 收音机并使用
获取它们
var inputs = form1.elements;
for (var i = 0; i < inputs.length; ++i) {
if (inputs[i].type == 'radio') {
}
}
您可以将 class 分配给应该评分的元素,然后迭代这些元素。
这是一个演示:https://jsfiddle.net/zephyr_hex/1o9u19be/
JS
var myBtn = document.getElementById('getScore');
myBtn.addEventListener('click', function() {
var elems = document.getElementsByClassName('quiz');
for (var i = 0; i < elems.length; i++) {
if (elems[i].checked) {
console.log(elems[i].value);
//add your scoring logic here. elems[i].value is the selected value
}
}
});
HTML
<form name="quiz" method="post" action="mailto:myemail" enctype="text/plain">
<h2>First name:</h2>
<input type="text" name="Firstname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Last name:</h2>
<input type="text" name="Lastname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Trade Partner:</h2>
<input type="text" name="Trade Partner" value="" style="color: #000000; background-color: #d9d9d9;">
<br>
<br>
<br>
<p>
<h2>1. What is the output Voltage and Current of the Charger?</h2>
<br>
<input class="quiz" type="radio" name="q1" value="24v 1A">24v 1A
<br>
<input class="quiz" type="radio" name="q1" value="33v 5A">33v 5A
<br>
<input class="quiz" type="radio" name="q1" value="24v 5A">24v 5A
<br>
<input class="quiz" type="radio" name="q1" value="33v 1A">33v 1A
<br>
<br>
<br>
<p>
<h2>2. If you were checking the communications voltage for any of the powered options (Auto Hinge, Powered Footplate or Powered Swivel)what would you expect to see?</h2>
<br>
<input class="quiz" type="radio" name="q2" value="Climbs from between 8 -12v up to battery Voltage">Climbs from between 8 -12v up to battery Voltage
<br>
<input class="quiz" type="radio" name="q2" value="Climbs from 4v to Battery Voltage">Climbs from 4v to Battery Voltage
<br>
<input class="quiz" type="radio" name="q2" value="24v">24v
<br>
<input class="quiz" type="radio" name="q2" value="33v">33v
<br>
<br>
<br>
<p>
<h2>3. What does it mean if fault code 'E' is displayed on the diagnostic display?</h2>
<br>
<input class="quiz" type="radio" name="q3" value="Main power relay stuck open">Main power relay stuck open
<br>
<input class="quiz" type="radio" name="q3" value="Main power relay welded closed">Main power relay welded closed
<br>
<input class="quiz" type="radio" name="q3" value="The main power relay closed early">The main power relay closed early
<br>
<input class="quiz" type="radio" name="q3" value="Error">Error
<br>
<br>
<br>
<p>
<h2>4. What is the minimum length of a Slidetrack rail?</h2>
<br>
<input class="quiz" type="radio" name="q4" value="2 Meters">2 Meters
<br>
<input class="quiz" class="quiz" type="radio" name="q4" value="2.1 Meters">2.1 Meters
<br>
<input class="quiz" type="radio" name="q4" value="2.2 Meters">2.2 Meters
<br>
<input class="quiz" type="radio" name="q4" value="2.5 Meters">2.5 Meters
<br>
<br>
<br>
<p>
<input id="getScore" type="button" value="Get score">
<br>
<br>
<br>
<font face="arial" color="#5f5f5f">Score = <input type=text size=15 name="percentage" style="color: #000000; background-color: #d9d9d9;"><br><br>
Correct answers:</font>
<br>
<textarea name="solutions" wrap="virtual" rows="10" cols="40" style="color: #000000; background-color: #d9d9d9;"></textarea>
<br>
<br>
<input type="submit" value="Send Form">
<input type="reset" value="Clear Form">
</form>
我正在创建一个测试,其中计算结果并给出一个百分比。它在底部显示正确答案。结果可以通过电子邮件发回给我。下面的代码 worked.Excuse 布局,我对此很陌生。
<html><head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="testpageCSS.css" rel="stylesheet" type="text/css">
<script language="JavaScript">
<!--
var numQues = 4;
var numChoi = 4;
var answers = new Array(4);
answers[0] = "33v 1A";
answers[1] = "Climbs from between 8 -12v up to battery Voltage";
answers[2] = "Main power relay stuck open";
answers[3] = "2 Meters";
function getScore(form) {
var score = 0;
var currElt;
var currSelection;
for (i=0; i<numQues; i++) {
currElt = i*numChoi;
for (j=0; j<numChoi; j++) {
currSelection = form.elements[currElt + j];
if (currSelection.checked) {
if (currSelection.value == answers[i]) {
score++;
break;
}
}
}
}
score = Math.round(score/numQues*100);
form.percentage.value = score + "%";
var correctAnswers = "";
for (i=1; i<=numQues; i++) {
correctAnswers += i + ". " + answers[i-1] + "\r\n";
}
form.solutions.value = correctAnswers;
}
// -->
</script>
</head>
<body>
<div id="centerTOP">
<h1> HCA001</h1>
</div>
<div id="center">
<form name="quiz" method="post" action="mailto:myemail"enctype="text/plain">
<h2>First name:</h2>
<input type="text" name="Firstname" value="" style="color: #000000;"
background-color: #d9d9d9;">
<h2>Last name:</h2>
<input type="text" name="Lastname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Trade Partner:</h2>
<input type="text" name="Trade Partner" value="" style="color: #000000; background-color: #d9d9d9;">
<br><br><br>
<p>
<h2>1. What is the output Voltage and Current of the Charger?</h2><br>
<input type="radio" name="q1" value="24v 1A">24v 1A<br>
<input type="radio" name="q1" value="33v 5A">33v 5A<br>
<input type="radio" name="q1" value="24v 5A">24v 5A<br>
<input type="radio" name="q1" value="33v 1A">33v 1A<br><br><br>
<p>
<h2>2. If you were checking the communications voltage for any of the powered options (Auto Hinge, Powered Footplate or Powered Swivel)what would you expect to see?</h2><br>
<input type="radio" name="q2" value="Climbs from between 8 -12v up to battery Voltage">Climbs from between 8 -12v up to battery Voltage<br>
<input type="radio" name="q2" value="Climbs from 4v to Battery Voltage">Climbs from 4v to Battery Voltage<br>
<input type="radio" name="q2" value="24v">24v<br>
<input type="radio" name="q2" value="33v">33v<br><br><br>
<p>
<h2>3. What does it mean if fault code 'E' is displayed on the diagnostic display?</h2><br>
<input type="radio" name="q3" value="Main power relay stuck open">Main power relay stuck open<br>
<input type="radio" name="q3" value="Main power relay welded closed">Main power relay welded closed<br>
<input type="radio" name="q3" value="The main power relay closed early">The main power relay closed early<br>
<input type="radio" name="q3" value="Error">Error<br><br><br>
<p>
<h2>4. What is the minimum length of a Slidetrack rail?</h2><br>
<input type="radio" name="q4" value="2 Meters">2 Meters<br>
<input type="radio" name="q4" value="2.1 Meters">2.1 Meters<br>
<input type="radio" name="q4" value="2.2 Meters">2.2 Meters<br>
<input type="radio" name="q4" value="2.5 Meters">2.5 Meters<br><br><br>
<p>
<input type="button" value="Get score" onClick="getScore(this.form)"><br> <br><br>
<font face="arial" color="#5f5f5f">Score = <input type=text size=15 name="percentage" style="color: #000000; background-color: #d9d9d9;"><br><br>
Correct answers:</font><br>
<textarea name="solutions" wrap="virtual" rows="10" cols="40" style="color: #000000; background-color: #d9d9d9;"></textarea>
<br><br>
<input type="submit" value="Send Form">
<input type="reset" value="Clear Form">
</form>
</div>
</body></html>
然后我需要添加如下文本字段以输入测试用户详细信息,我已将其添加到可提交表单中。现在脚本也尝试使用文本字段来计算分数,这给出了一个不正确的 result.Any 如何更改脚本以仅查看单选按钮输入的想法?
<h2>First name:</h2>
<input type="text" name="Firstname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Last name:</h2>
<input type="text" name="Lastname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Trade Partner:</h2>
<input type="text" name="Trade Partner" value="" style="color: #000000; background-color: #d9d9d9;">
设置类型 属性 收音机并使用
获取它们var inputs = form1.elements;
for (var i = 0; i < inputs.length; ++i) {
if (inputs[i].type == 'radio') {
}
}
您可以将 class 分配给应该评分的元素,然后迭代这些元素。
这是一个演示:https://jsfiddle.net/zephyr_hex/1o9u19be/
JS
var myBtn = document.getElementById('getScore');
myBtn.addEventListener('click', function() {
var elems = document.getElementsByClassName('quiz');
for (var i = 0; i < elems.length; i++) {
if (elems[i].checked) {
console.log(elems[i].value);
//add your scoring logic here. elems[i].value is the selected value
}
}
});
HTML
<form name="quiz" method="post" action="mailto:myemail" enctype="text/plain">
<h2>First name:</h2>
<input type="text" name="Firstname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Last name:</h2>
<input type="text" name="Lastname" value="" style="color: #000000; background-color: #d9d9d9;">
<h2>Trade Partner:</h2>
<input type="text" name="Trade Partner" value="" style="color: #000000; background-color: #d9d9d9;">
<br>
<br>
<br>
<p>
<h2>1. What is the output Voltage and Current of the Charger?</h2>
<br>
<input class="quiz" type="radio" name="q1" value="24v 1A">24v 1A
<br>
<input class="quiz" type="radio" name="q1" value="33v 5A">33v 5A
<br>
<input class="quiz" type="radio" name="q1" value="24v 5A">24v 5A
<br>
<input class="quiz" type="radio" name="q1" value="33v 1A">33v 1A
<br>
<br>
<br>
<p>
<h2>2. If you were checking the communications voltage for any of the powered options (Auto Hinge, Powered Footplate or Powered Swivel)what would you expect to see?</h2>
<br>
<input class="quiz" type="radio" name="q2" value="Climbs from between 8 -12v up to battery Voltage">Climbs from between 8 -12v up to battery Voltage
<br>
<input class="quiz" type="radio" name="q2" value="Climbs from 4v to Battery Voltage">Climbs from 4v to Battery Voltage
<br>
<input class="quiz" type="radio" name="q2" value="24v">24v
<br>
<input class="quiz" type="radio" name="q2" value="33v">33v
<br>
<br>
<br>
<p>
<h2>3. What does it mean if fault code 'E' is displayed on the diagnostic display?</h2>
<br>
<input class="quiz" type="radio" name="q3" value="Main power relay stuck open">Main power relay stuck open
<br>
<input class="quiz" type="radio" name="q3" value="Main power relay welded closed">Main power relay welded closed
<br>
<input class="quiz" type="radio" name="q3" value="The main power relay closed early">The main power relay closed early
<br>
<input class="quiz" type="radio" name="q3" value="Error">Error
<br>
<br>
<br>
<p>
<h2>4. What is the minimum length of a Slidetrack rail?</h2>
<br>
<input class="quiz" type="radio" name="q4" value="2 Meters">2 Meters
<br>
<input class="quiz" class="quiz" type="radio" name="q4" value="2.1 Meters">2.1 Meters
<br>
<input class="quiz" type="radio" name="q4" value="2.2 Meters">2.2 Meters
<br>
<input class="quiz" type="radio" name="q4" value="2.5 Meters">2.5 Meters
<br>
<br>
<br>
<p>
<input id="getScore" type="button" value="Get score">
<br>
<br>
<br>
<font face="arial" color="#5f5f5f">Score = <input type=text size=15 name="percentage" style="color: #000000; background-color: #d9d9d9;"><br><br>
Correct answers:</font>
<br>
<textarea name="solutions" wrap="virtual" rows="10" cols="40" style="color: #000000; background-color: #d9d9d9;"></textarea>
<br>
<br>
<input type="submit" value="Send Form">
<input type="reset" value="Clear Form">
</form>