Hi,
there used to be a simple javascript quiz builder in builder.com, with
which I made the page whose code is given below.
I would like to tweak this so that there are only three (not 4) answer
options, and that they are presented alongside radio buttons (not in a
selectable list). I would be grateful if someone knows how to do this
for me. It would be nice if the student doing the quiz selects the
right answer with the radio button, then clicks a button (that I could
jazz up with a css style) that results in that answer being displayed
either in a single-line text area, or on the surface of another
button, perhaps like "Empty - Correct, well done!"
I don't know what the options are for the outputting of the answer -
can a text area (such as the code currently has) be styled with css
just as a button can be? I assume that in basic html the javascript
can't actively insert the answer with feedback into the html page into
which the quiz code was inserted...??
<html>
<head>
<title>Quiz</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<meta name="descripti on" content="A quiz for students">
<script language="JavaS cript">
<!--
var numQues = 1;
var answers = new Array(1);
answers[0] = "empty";
function getScore(form) {
var score = 0;
var currElt;
var currSelection;
for (i=0; i<numQues; i++) {
currElt = form.elements[i];
currSelection = currElt.selecte dIndex;
if (currElt.option s[currSelection].value == answers[i]) {
score++;
}
}
score = Math.round(scor e/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>
<form name="quiz">
<select name="q1">
<option value="">Choose word...
<option value="hungry"> hungry
<option value="empty">e mpty
<option value="late">la te
<option value="sad">sad
</select>
<p>
<input type="button" value="Get score" onClick="getSco re(this.form)">
<input type="reset" value="Clear">
<p> <font face="Comic Sans MS">Score / <font
color="#993300" >Ergebnis</font>
=</font>
<input type=text size=15 name="percentag e"><br>
<font face="Comic Sans MS">Correct answer / <font
color="#993300" >Richtige
Antwort</font>:</font><br>
<textarea name="solutions " wrap="virtual" rows="4"
cols="40"></textarea>
</form>
</body>
</html>
Thanks,
Dave
there used to be a simple javascript quiz builder in builder.com, with
which I made the page whose code is given below.
I would like to tweak this so that there are only three (not 4) answer
options, and that they are presented alongside radio buttons (not in a
selectable list). I would be grateful if someone knows how to do this
for me. It would be nice if the student doing the quiz selects the
right answer with the radio button, then clicks a button (that I could
jazz up with a css style) that results in that answer being displayed
either in a single-line text area, or on the surface of another
button, perhaps like "Empty - Correct, well done!"
I don't know what the options are for the outputting of the answer -
can a text area (such as the code currently has) be styled with css
just as a button can be? I assume that in basic html the javascript
can't actively insert the answer with feedback into the html page into
which the quiz code was inserted...??
<html>
<head>
<title>Quiz</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<meta name="descripti on" content="A quiz for students">
<script language="JavaS cript">
<!--
var numQues = 1;
var answers = new Array(1);
answers[0] = "empty";
function getScore(form) {
var score = 0;
var currElt;
var currSelection;
for (i=0; i<numQues; i++) {
currElt = form.elements[i];
currSelection = currElt.selecte dIndex;
if (currElt.option s[currSelection].value == answers[i]) {
score++;
}
}
score = Math.round(scor e/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>
<form name="quiz">
<select name="q1">
<option value="">Choose word...
<option value="hungry"> hungry
<option value="empty">e mpty
<option value="late">la te
<option value="sad">sad
</select>
<p>
<input type="button" value="Get score" onClick="getSco re(this.form)">
<input type="reset" value="Clear">
<p> <font face="Comic Sans MS">Score / <font
color="#993300" >Ergebnis</font>
=</font>
<input type=text size=15 name="percentag e"><br>
<font face="Comic Sans MS">Correct answer / <font
color="#993300" >Richtige
Antwort</font>:</font><br>
<textarea name="solutions " wrap="virtual" rows="4"
cols="40"></textarea>
</form>
</body>
</html>
Thanks,
Dave
Comment