Tweet
Does anyone know how I can modify the code below to show a question that has more then one fill in the blank? For example:
_____ is an attitude or behavior which leads another to do ________.
Thank you.
_____ is an attitude or behavior which leads another to do ________.
Thank you.
Code:
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
var question_type=new Array(4)
question_type[0]="mult";
question_type[1]="mult";
question_type[2]="blank";
question_type[3]="blank";
var questions=new Array(4)
questions[0]="The words used to <u>describe</u> the manifestation of Jesus as Messiah of Israel, Son of God and Savior of the world are ...";
questions[1]="Which of these is not a symbol of the Holy Spirit?";
questions[2]="Human life must be respected and protected absolutely from the moment of ______.";
questions[3]="_____ is an attitude or behavior which leads another to do evil.";
var answers = new Array(4)
answers[0]= "B"; //The Epiphany
answers[1]= "C"; //Sunshine [water, fire, anointing]
answers[2]="conception";
answers[3]="scandal";
var each_question = new Array(3)
each_question[0]="<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>"
+ questions[0] + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%'>" + " " + "</td>" + "<td>" + " " + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='A'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The creed" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='B'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The Epiphany" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='C'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The magisterium" + "</font>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='D'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The Annunciation" + "</font>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + " " + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>";
each_question[1]="<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>"
+ questions[1] + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%'>" + " " + "</td>" + "<td>" + " " + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='A'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Water" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='B'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Fire" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='C'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Sunshine" + "</font>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='D'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Anointing" + "</font>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + " " + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>";
each_question[2] = "<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>"
+ questions[2] + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%'>" + " " + "</td>" + "<td>" + " " + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='text' name='text_field'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + " " + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>";
each_question[3] = "<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>"
+ questions[3] + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%'>" + " " + "</td>" + "<td>" + " " + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + "<input type='text' name='text_field'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "</font>" + "</td>" + "</tr>" +
"<tr>" + "<td width='28%' align='right'>" + " " + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>";
var currentQuestion=0;
var score=0;
function writeEachQuestion() {
if(currentQuestion==0){
top.bottom_right.document.open();
top.bottom_right.document.write("<center>" + "<h3>" + "<font face='arial, helvetica, verdana'>" + "Go get 'em," + " " + userName + "!" + "<br>" + "</h3>" +
"Let's see how well" + "<br>" + "you know your faith!" + "</center>" + "</font>");
top.bottom_left.document.write(each_question[currentQuestion]);
} else {
top.bottom_left.document.write(each_question[currentQuestion]);
top.bottom_right.document.open();
}
}
function swapper() {
top.bottom_left.document.fish_first.src="next2.gif";
}
function unswapper() {
top.bottom_left.document.fish_first.src="next.gif";
}
function checkQuestionType() {
if (question_type[currentQuestion-1]=="mult"){
multChecker();
} else if (question_type[currentQuestion-1]=="blank") {
textChecker();
}
}
function multChecker() {
var answerValue=answers[currentQuestion-1];
var checkedIndex = -1;
for(i=0; i < top.bottom_left.document.quiz_questions.choice.length; i++) {
//if a radio button is checked, the variable checkedIndex is set to the value of that index number.
if(top.bottom_left.document.quiz_questions.choice[i].checked){
checkedIndex = i;
selected_answer = top.bottom_left.document.quiz_questions[checkedIndex].value;
}
}
if (selected_answer==answerValue) {
score++;
//The angelTableCorrect() function runs(see below).
angelTableCorrect();
//An alert pops up if nothing's checked, with a string telling the user to guess next time.
} else if (checkedIndex==-1){
alert("Next time," + " " + userName + "," + " " + "take a guess!");
//Because I'm heartless, the user isn't given a second chance. If not guess was made, angelTableWrong() executes (see below).
angelTableWrong();
} else {
angelTableWrong();
}
}
function textChecker() {
var answerValue=answers[currentQuestion-1];
//theWord represents the user's input.
var theWord = top.bottom_left.document.quiz_questions.text_field.value;
theWordLower=theWord.toLowerCase();
if(theWordLower==answerValue) {
score++;
angelTableCorrect();
} else if (theWord!=answerValue) {
angelTableWrong();
}
}
function angelTableCorrect () {
top.top_right.document.open();
top.top_right.document.write("<table align='left'>" +
"<tr>" + "<td align='center'>" + "<font face='Arial'>" + "Right," + " " +
userName + "!" + "<br>" + "You're" + " " + score + " " + "out of" + " " + currentQuestion +
"</td>" + "<td>" + "<img src='angel_correct.gif'>" + "</td>" +
"</tr>" + "</table>");
}
function angelTableWrong () {
top.top_right.document.open();
top.top_right.document.write("<table align='left'>" +
"<tr>" + "<td align='center'>" + "<font face='Arial'>" + "Wrong," + " " + userName + "." + "<br>" +
"You're" + " " + score + " " + "out of" + " " + currentQuestion +
"</td>" + "<td>" + "<img src='angel_wrong.gif'>" + "</td>" +
"</tr>" + "</table>");
}
function writeBeginning() {
top.bottom_left.document.clear();
top.bottom_left.document.open();
top.bottom_left.document.write("<html>" + "<head>" + "</head>" + "<body>" + "<form name='quiz_questions'>");
}
//This function writes the concluding part of each quiz question table in the bottom_left frame, except for the last one.
//The last one's Next button has to call a different function, so I wrote the next function to do that.
function writeEnding(){
top.bottom_left.document.write("<img name='fish_first' src='next.gif' align='right' onMouseOver='top.top_left.swapper();' onMouseOut='top.top_left.unswapper();' onMouseUp='top.top_left.onNext();'>" +
"</form>" + "</body>" + "</html>")
}
//This function writes the concluding part of the last question, which has a next button that calls a
//different function.
function writeEndingLast(){
top.bottom_left.document.write("<img name='fish_first' src='next.gif' align='right' onMouseOver='top.top_left.swapper();' onMouseOut='top.top_left.unswapper();' onMouseUp='top.top_left.writeMailTable();'>" +
"</form>" + "</body>" + "</html>")
}
function writeMailTable(){
top.top_right.document.open();
top.top_right.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "Thank you for" + "<br>" + "taking the quiz," + " " + userName + "!" + "<br><br>" + "</center>");
top.bottom_right.document.open();
top.bottom_right.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "If you don't have questions" + "<br>" + "you'd like to have answered," + " " + "<a href='http://www.archden.org' target='_blank')>" + "return to the" + "<br>" + "Archdiocese of Denver home page." + "</a>" + "</center>");
top.bottom_left.document.open();
top.bottom_left.document.write("<font face='arial, verdana, helvetica'>" + "Do you have questions about this quiz," + " " + userName + "?" + " " + "<img src='angel_final.gif' align='right'>" + "Post them in"
+ " " + "<a href='http://www.archden.org/ubb' target='_blank')>" + "The Upper Room," + "</a>" + " " + "the online community of the Archdiocese of Denver, in the 'What Does the Church Teach About ...?' forum!");
}
function onNext() {
//Write a table to the_questions.htm that includes a variable for the new question.
if(currentQuestion==3) {
currentQuestion++;
textChecker();
doTheMath();
top.bottom_left.document.open();
top.bottom_left.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "You got" + " " + "<b>" + finalPercent + "%" + "</b>" + " " + "of the questions right," + " " + userName + "!" + "<br>" + "Click on the 'Next' fish" + "<br>" + "one more time to find out" + "<br>" + "how to get answers for those questions you missed." + "</center>" + "</font>");
writeEndingLast();
} else {
currentQuestion++;
checkQuestionType();
writeBeginning();
writeEachQuestion();
writeEnding();
}
}
//The doTheMath function divides the score by 20, and that multiplies that value by 100 to come up
//with a final percentage value. That is used in the string written at the end (in the above onNext function).
function doTheMath(){
thePercent=score/4;
finalPercent=thePercent*100;
}
</script>
</head>
<body bgcolor="#FFFFFF" onLoad="writeBeginning(); writeEachQuestion(); writeEnding();">
<img src="title.gif" width="371" height="109">
<script language="JavaScript">
</script>
</body>
</html>
Comment