Netscape 6, Part III: The Event Model: Setting Event Listeners in Netscape 6 - Doc JavaScript | WebReference

Netscape 6, Part III: The Event Model: Setting Event Listeners in Netscape 6 - Doc JavaScript


Netscape 6, Part III: The Event Model

Setting Event Listeners in Netscape 6

Netscape 6 has a unique event model. It combines the Netscape Navigator 4.x event model with that of Internet Explorer. Events in Navigator propagate downwards from the browser window object to the target object. Any object in the hierarchy can capture the event before it reaches the target object. Events in Internet Explorer propagate in the opposite direction. They bubble from the target object towards the browser window object. Any object can process the event on its way up. Netscape 6 supports both directions. The event dives in from the browser window object to the target object and then bubbles back to the window object. You can specify whether you want to intercept the event during its dive (capture phase) or its ascend (bubbling phase).

Another advantage of the Netscape 6 event model is the ability to specify more than one action per an event type, similarly to how you do it in Internet Explorer 5.x. Netscape Navigator 4.x supports only one action per an event type. If you want to invoke the function buttonClicked() whenever a button is clicked, you would write its event handler as:

onClick = buttonClicked();

But what if you want to specify another function to invoke? That's where Netscape 6 kicks in. Netscape 6 introduced a new event concept, the event listener, which is similar to attachEvent() in Internet Explorer 5.x. You attach an event listener to an object. The event listener listens for a specified event, and when the event occurs, the event listener executes a pre-specified action. You can define several event listeners for the same object, and for the same event type. For example, two separate event listeners can listen to a click event for a specific button, and execute two different actions when the event occurs. You add an event listener by the addEventListener() method:

object.addEventListener(eventType, functionCall, downBool)

where:

Next: How to use event handlers in a real example

http://www.internet.com


Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: January 1, 2001
Revised: January 1, 2001

URL: http://www.webreference.com/js/column74/4.html