| home / programming / javascript / beginning / chap6 / 6 |
[next] |
|
The Trivia QuizIt's time to return to the Trivia Quiz as we left it in Chapter 3. So far we have defined the questions and answers in arrays, and defined a function to check whether the user's answer is correct. Now we know how to create HTML forms and elements, we can start using them in the quiz to provide the user input. By the end of this section the question form will look like the picture below.
At present our questions are multi-choice; we represent the multi-choice options by a radio button group. We create the form elements dynamically using our old friend document.write() and the information contained in the questions array. Once the user has selected the radio button representing the answer, they then click the Check Question button, which calls our checkAnswer() function, works out if the user got the question right, and lets them know. We then move on to the next question. Let's start by creating the form elements. Creating the FormThe first thing we need to do is add a form to our page in which the radio buttons will be written. Load in trivia_quiz.htm and change the bottom of the page, below where the questions and answers arrays are defined as follows:
|