Guide to Jean Alvares' Short-Answer Quiz Javascript.  

Below (CLICK  HERE ) is the HTML code for web page containing the Javascript for short-answer  exercise I have created  HERE .This script allows to you to present a set number of questions which ask for a short answer. The script can compare the answer the student types in with one you have previously defined in the script and determine if it is the same, and assign a score. The student's answers can be one letter (which could be good for a multiple-choice type question, one word or a few words long. But remember, the script allows for only one answer, and the longer the answer, the more possibilities  for a typo. This javascript  keeps a running score as the student goes through the quiz.  If you want to see a simple example of such a javascript quiz in action, go  HERE .

To manipulate this javascript, you can copy the HTML code and then save it in a text-only file with a name like MYFILE.HTML, then open it up in a text editor and make  various changes as I describe them below. Remember, when you save this file, it must remain a text-only file, without any italics, boldfacing, or underlining.  You must make sure to make the changes exactly as I specify, or the program will CRASH. 

While one must be careful, it is not too difficult to manipulate this javascript to create different questions and answers. Below are the main areas to be manipulated.

First, how do define or change the initial  questions? Tou This javascript uses arrays, which are lists that contain questions, answers, etc. Thus to change the questions in this javascript, go to the array that contains the questions. Click  HERE  to go to that part of the javascript. See how TEXT OF QUESTION 1. is within quotation marks? Javascript uses quotation marks as part of its basic code for defining text. These boldfaced words and the period can be replaced with whatever text you wish. If the question is long, you may have to adjust the size of the window that the question will appear in. Go  HERE   to see how to do this. However, in writing your question, DO NOT use quotation marks or apostrophes, since Javascript uses these as part of its code, and it may confuse the program. Likewise, do not use italics, underlining or boldfacing. I have only done so to make the text to be substituted clearer.

How do I create the answers to these questions? Again, you go to the array that contains the list of answers. Click  HERE  to go to that section of the javascript. Notice the words, number and period RIGHT ANSWER 1. enclosed in quotation marks. Again, just as in the case of questions, you simply substitute the boldfaced phrase with your chosen correct answer. Remember, the script only can handle EXACT matches. It is probably good somewhere on the page to make sure the students know they have to spell correctly, whether they need to use punctuation, etc.
 

How do I give the students the correct answer to the question or some response to a wrong answer?  The illustration to the left shows you the window and the message it displays if a wrong answer is given. Click  HERE if you wish to go to the section of the

javascript that produces this message. You could change the phrase Sorry, you are  incorrect. The answer is (which is in quotation marks) to something else, for example If you want to find the correct answer, go to page  The strange bit of code + reference[form.questNo.value] + tells the javascript to go to the third array to get the word or phrase that will be put after the text. Click  HERE  to go to that section of the javascript. Again, as in the previous two arrays, you have a phrase between two quotation marks, which you can alter, here RESPONSE TO ANSWER 1.

What if I want more than three questions? You can add questions, answers and responses easily. All you need to do is to exactly duplicate the form of a question, response or answer, one for each question in each array, and make sure you define the new question as questions[x], rightAns[x] or reference[x], x being the number of the question. Look below left to see the question array in the form I gave it, and to the right see how I have added a fourth question to the question array.
 

You also have to change a bit of the javascript which defines how many questions there are overall.  Click  HERE   to go to that part of the javascript. Note the simple code  var quizEnd = eval(3 * 1);   The 3 here defines the number of questions; change this number to the number of question you create. There must be the same number of questions, answers and responses  program to work. Thus if I had created 25 questions, the command would look like this var quizEnd = eval(25 * 1); 

You can also adjust the size of the boxes the questions, responses and answers appear within in the initial form. For example, to change the size of the box the question is put in, go  HERE to see the code <TEXTAREA COLS=50 ROWS=4 name="question" wrap=virtual></TEXTAREA> By changing the number of COLS the box becomes wider or narrower, and by changing ROWS the height of the box is changed.

If you want to change the size of the box the response appears in, go  HERE , where you see the code <TEXTAREA COLS=50 ROWS=3 name="results" wrap=virtual></TEXTAREA> Again, make the same changes as above.

If you want to change the length of the in which the correct answer is put, go  HERE to see the code <INPUT TYPE=TEXT NAME=yourChoice SIZE=20> . By changing the SIZE the space becomes longer or shorter.

Consider the illustration below. Note the name of the web page "Jean's Test Java Quiz 1". You can change this name by simply going  HERE  and replacing the phrase between <TITLE> and </TITLE>.

If you want to change the text seen below in red (TEST JAVASCRIPT QUIZ 1....)...and the lines below it, go  HERE   and  HERE  and  simply substitute your text for what is between the quotations marks.

These are the basic parts that can be modified. Again, you must be very careful, because the script is unforgiving of errors, misspellings, etc. But, if you experiment, you will soon learn how to easily manipulate this script.

A request. These javascripts are quite simple; so simple, in fact that somebody, like me, who really doesn’t comprehend javascript programming in any detail can manipulate them. However I encourage others who understand these scripts in greater depth to provide suggestions about how they could be improved. What I would really like to be able to figure out is how to add to the third javascript a way of creating a space in which students can add their names and a button that, when pressed, would e-mail the score and the student’s name to a predetermined address. Any suggestions welcome! For comments, corrections, advise, email me at  alvaresj@mail.montclair.edu  Thanks!

   The complete script.  

  Copyright April 1999 Jean Alvares
 
  visits since 16 April 1999.