Scripting event handlers

Each event is recognized by certain objects (HTML tags), summarized in the following table:

Event	Applies to	Occurs when	Event handler
abort	images	User aborts the loading of an image (for example by clicking a link or clicking the Stop button)	onAbort
blur	windows, frames, and all form elements	User removes input focus from window, frame, or form element	onBlur
click	buttons, radio buttons, checkboxes, submit buttons, reset buttons, links	User clicks form element or link	onClick
change	text fields, textareas, select lists	User changes value of element	onChange
error	images, windows	The loading of a document or image causes an error	onError
focus	windows, frames, and all form elements	User gives input focus to window, frame, or form element	onFocus
load	document body	User loads the page in the Navigator	onLoad
mouseout	areas, links	User moves mouse pointer out of an area (client-side image map) or link	onMouseout
mouseover	links	User moves mouse pointer over a link	onMouse- Over
reset	forms	User resets a form (clicks a Reset button)	onReset
select	text fields, textareas	User selects form element's input field	onSelect
submit	submit button	User submits a form	onSubmit
unload	document body	User exits the page	onUnload

If an event applies to an HTML tag, then you can define an event handler for it. The name of an event handler is the name of the event, preceded by "on." For example, the event handler for the focus event is onFocus.

To create an event handler for an HTML tag, add an event handler attribute to the tag; Put JavaScript code in quotation marks as the attribute value. The general syntax is

<TAG eventHandler="JavaScript Code">

For example, suppose you have created a JavaScript function called compute. You can cause Navigator to perform this function when the user clicks a button by assigning the function call to the button's onClick event handler:

<INPUT TYPE="button" VALUE="Calculate" onClick="compute(this.form)">

Notice in the preceding example this.form refers to the current form. The keyword this refers to the current object, which is the button. The construct this.form then refers to the form containing the button. The onClick event handler is a call to the compute function, with the current form as the argument.

In general, it is good practice to define functions for your event handlers:

• It makes your code modular--you can use the same function as an event handler for many different items.
• It makes your code easier to read.