HTML and CSS Reference
In-Depth Information
The next step is to assign a value to the event property. The value will be a reference
to either a named function or an anonymous function. Note: When used as a reference,
the function name is not enclosed in quotes and does not have parentheses!
b1.click=greetings;
function greetings(){
alert("Welcome!");
}
or an anonymous function
b1.click=function(){alert(“Welcome!”);}
Now when the user clicks “button1” in the document, the JavaScript event handler
will be triggered and the greeting displayed in an alert box.
Another example of using JavaScript event handling is with the
onload
event. This
event is used to guarantee that the entire page has been loaded before an event is fired.
When a function is assigned to
onload
, the function will not be executed until the page
has loaded:
window.onload = init;
function init() {
do_something
}
You can also assign an anonymous function to the
onload
property as follows:
window.onload = function(){ do something; }
See Example 13.26. When the page has loaded, the function that was registered to the
event will be called. If you want to assign more than one function to the event, there are
several ways to do this. One method is to place several function calls in a chain, using
one onload event handler.
function start() {
func1();
func2();
}
window.onload = start;
Like the inline model, each event can only have one event handler registered. To
remove an event handler, simply set the property to null. Object event properties are
shown in Table 13.11.
For a more elegant examples of how to use onload go to
http://www.site-
