Java Reference
In-Depth Information
}
var option = new Option("Wednesday", 2);
options[2] = option;
} else {
alert("Do you want to have TWO Wednesdays?");
}
}
theForm.btnRemoveWed.addEventListener("click", btnRemoveWedClick);
theForm.btnAddWed.addEventListener("click", btnAddWedClick);
</script>
</body>
</html>
Save this as
ch11 _ example7.html
. If you type the page in and load it into your browser, you should see
the form shown in Figure 11-9. Click the Remove Wednesday button, and you'll see Wednesday disappear
from the list. Add it back by clicking the Add Wednesday button. If you try to add a second Wednesday
or remove a nonexistent Wednesday, you'll get a polite warning telling you that you can't do that.
figure 11-9
Within the body of the page, you define a form with the name
theForm
. This contains the
<select/>
element, which includes day‐of‐the‐week options that you have seen previously. The form also contains
two buttons, as shown here:
<input type="button" value="Remove Wednesday" name="btnRemoveWed" />
<input type="button" value="Add Wednesday" name="btnAddWed" />
You want to execute JavaScript code when these buttons are clicked; therefore, you want to register
click
event listeners for each of the buttons. To make this a bit easier, you first create a variable called
theForm
, which contains the
<form/>
element object:
var theForm = document.theForm;
