HTML and CSS Reference
In-Depth Information
As shown in previous examples, if the user clicks the submit button, JavaScript can
check to see if a form was filled out properly; or if the mouse moves over a link, Java-
Script can replace one image with a new one. JavaScript's response to one of these user-
initiated events is called
event handling
. If the user clicks a button, for example, Java-
Script might handle the event by calling a function that will perform some designated
task, such as to open a new window or bring a window into focus, perform a calcula-
tion, or submit a fillout form. Here is a list of some of the kinds of events that Java-
Script can handle:
•
Mouse actions.
•
Keyboard actions.
•
Actions on form fields.
•
When the page is first loaded or unloaded.
•
After a specified time has passed.
•
When an error has occurred.
JavaScript event handlers are
not
enclosed between
<script></script>
tags. Event han-
dlers are attributes of HTML tags (specified in the HTML 4 specification). If the event is
associated with a form tag, then it will be an attribute of the
<form>
tag, and if associated
with a link, it will be an attribute of the
<a href>
tag, and so on. Once you have decided
what event you want to handle, you normally assign a function to the event handler.
This is called registering the event.
To register an event, a string representing a command is assigned to the event handler.
The command, usually a JavaScript function, will be executed when the event is trig-
gered by the user. Whereas a property or method might be associated with a single
object, events are usually associated with more than one object. The
onClick
event han-
dler, for example, may be associated with a form's input tag, but it could also be associ-
ated with a link tag, or an image map area, or a simple button. There is an order in which
events are handled. See the section “Capturing and Bubbling (Trickle Down and Bubble
Up)” on page 500.
(Note the spelling convention used for the event handlers. The first word,
on
, is all
lowercase, and the first letter of each subsequent word is capitalized. Unless the event is
being used as a method in a JavaScript program (see the section “JavaScript Object Meth-
ods and Events” on page 462), it is not case sensitive. Using
onClick
or
onclick
is fine.)
Consider the following example:
<form>
<input type="button"
value="Wake me"
onClick="wakeUpCall()" />
</form>
