Java Reference
In-Depth Information
var options = days.options;
if (options[2].text != "Wednesday") {
var option = new Option("Wednesday", 2);
var thursdayOption = options[2];
try {
days.add(option, thursdayOption);
}
catch (error) {
days.add(option, 2);
}
} else {
alert("Do you want to have TWO Wednesdays?");
}
}
In IE7 (or IE8 in non‐standards mode), the browser will throw an error if you pass an
Option
object
as the second parameter. So use a
try...catch
statement to catch the error and pass a number to the
second argument, as this code shows.
The
Select
object's
remove()
method accepts just one parameter, namely the index of the option
you want removed. When an option is removed, the options at higher index positions are moved
down in the collection to fill the gap.
Using the
remove()
method, you can rewrite the
btnRemoveWedClick()
function in
ch11 _ example7.html
to look like this:
function btnRemoveWedClick() {
var days = theForm.theDay;
if (days.options[2].text == "Wednesday") {
days.remove(2);
} else {
alert("There is no Wednesday here!");
}
}
Modify the previous example and save it as
ch11 _ example8.html
before loading it into your
browser. You'll see that it works just as the previous version did.
Select element events
Select elements have three events:
blur
,
focus
, and
change
. You've seen all these events before. You
saw the
change
event with the text box element, where it fired when focus was moved away from
the text box
and
the value in the text box had changed. Here it fires when the user changes which
option in the list is selected.
World Time Converter
trY it out
Let's take a look at an example that uses the
change
event. The World Time Converter lets you
calculate the time in different countries:
