codescriptsevendrill.html

The HTML code for scriptsevendrill.html

Here is the code for the web page scriptsevendrill.html. Notice how much it is like the code for scriptfivedrill.html. I have used the same color coding below as in the overall listing of the javascripts found here.

Notice how the variables (the names that the buttons display and the preprogrammed responses are in red, while the preprogrammed answer is in blue, and the names of the fields and the variables associated with them (each which must be different) in green. Notice how we have simply copied the script found here for Script Seven, five times. To make sure the field names are different, you can, each time you copy these lines of javascript, do a simple substitution. For example, after you have duplicated the script a second time, you can highlight that script and do a search and replace command that replaces 1 with 2. Notice that would change both the number of the question and the name of the variable, which thus changes from ansOne1 to ansOne2. After you do something similar for the next three questions, you can go back and change the simplier variables in blue (which define the preprogrammed answers), and in red, which are the reponses, plus the text that lies outside the javascript proper.

At the end I have added Script Twenty-Four which will clear all the fields of the page. It too has a fieldname that must be unique.

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="GENERATOR" content="Mozilla/4.51 (Macintosh; U; PPC) [Netscape]">
<title>Quiz on the Symbols of Elements Using Script Seven</title>
</head>
<body text="#000000" bgcolor="#FFFFFF" link="#0000FF" vlink="#551A8B" alink="#0000FF" >
<form>
<center><big> Quiz on the symbols of the elements.</big></center><br><br>
In the field type the element that corresponds to the abbreviation.
<br>Use only lower-case letters. Do not use extra spaces. <br><br>
1. Pb <input TYPE="TEXT" NAME="ansOne1" SIZE="20">
<input type="button" value="Check" onClick="
if( form.ansOne1.value == 'lead')
{
alert('Yesssss!!!');}
else
alert('No. The answer is: lead');">
<br><br>

2. Au <input TYPE="TEXT" NAME="ansOne2" SIZE="20">
<input type="button" value="Check" onClick="
if( form.ansOne2.value == 'gold')
{
alert('Yesssss!!!');}
else
alert('No. The answer is: gold');">
<br><br>

3. Ag <input TYPE="TEXT" NAME="ansOne3" SIZE="20">
<input type="button" value="Check" onClick="
if( form.ansOne3.value == 'silver')
{
alert('Yesssss!!!');}
else
alert('No. The answer is: silver');">
<br><br>
4. Cu <input TYPE="TEXT" NAME="ansOne4" SIZE="20">
<input type="button" value="Check" onClick="
if( form.ansOne4.value == 'copper')
{
alert('Yesssss!!!');}
else
alert('No. The answer is: copper');">
<br><br>
5. Pb <input TYPE="TEXT" NAME="ansOne5" SIZE="20">
<input type="button" value="Check" onClick="
if( form.ansOne5.value == 'iron')
{
alert('Yesssss!!!');}
else
alert('No. The answer is: iron');">
<br><br>

<input type="reset" value="Click here to clear form" name="STARTOVER">
</form>
</body>
</html>

Return to Jean Alvares' Javascript Guide and Links