This page requires a JavaScript-compatible browser.

JS

JavaScript Demos:
Forms-based Quiz.

jim.cerny@unh.edu   13-AUG-1998


Please try this simple Internet quiz.
Select the correct answers from the choices on the drop down menus. Any that you get wrong will have a check mark placed in the check box. Good luck.

1.Who invented the computer?
2.Who developed HTML?
3.Where was the modern desktop computer invented?

You got out of correct. Your score is


Discussion.

This example is an easily modified example of a quiz. The quiz layout is done as an HTML Form. Checking the answers is completely done with JavaScript. No CGI script on the server is involved to do the checking and the results are not recorded.

To add a fourth question, you need to modify both the JavaScript in the HTML HEAD and to add a Form in the HTML BODY, following the code and comments. Specifically, at each place in the JavaScript there is an "//Addition" comment, that should be replaced as:

  1. addition #1
    result4=document.form4.answer4.selectedIndex;
  2. addition #2
    if (result4==0){
    alert("Question #4 was not answered");}
  3. addition #3
    if (result4==1){i++}
    and replace "1" with the correct answer code.
  4. addition #4
    if (result4 != 4){
    document.form4.check4.checked = "yes"}
  1. Plus change the divisor where the percentage correct is calculated, increasing it from 3 to 4:
    var per = ((i / 4) * 100);
Then, copy the HTML Form code for the third question, place it after the third question, and edit the form name, input name, and select name to have a "4" in them instead of a "3".

I've closely followed an example by Doug Popeney, but omitting some of his annotation and changing the quiz specifics. His JavaScript examples Web page is at: http://www.calpoly.edu/~dpopeney/javascript.html.

There are other ways this could be done, e.g., the questions and answers could be stored in arrays and for a quiz substantially longer than this example, that would make the JavaScript code somewhat more compact. There is a similar quiz example in the Heinle [1997] book, pp. 194-201, that uses an array. You could also design the form and script so that the student must succeed on each question before they are allowed to proceed to the next question. ;^)

Note - at this time the computation of the correct score is not working.