December 29, 2000 - The Navigator Event Model | WebReference

December 29, 2000 - The Navigator Event Model

Yehuda Shiran December 29, 2000
The Navigator Event Model
Tips: December 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

In order to understand the new event handling strategy in Netscape 6, you need to refresh your knowledge of how it is done in Netscape Navigator 4.x. The main idea is an event is falling inward, from the window object, through the document object and any other intermediate objects, until it reaches the target object. Netscape introduced the concept of event capturing. You can intercept an event at any object, before it reaches the final target element. The following piece of code creates a button event handlers for both the button and the window object. Notice how we capture the click event at the window object:

<SCRIPT LANGUAGE="JavaScript">
<!--
function buttonClicked(e) {
  alert("You clicked a button.");
  return true;
}
function windowClicked(e) {
  alert("You clicked in the window");
  return true;
}
if (window.captureEvents)
  window.captureEvents(Event.CLICK); // CLICK is an event
window.onclick = windowClicked; // onclick is an event handler
// -->
</SCRIPT>
<FORM NAME="myForm">
<INPUT TYPE="button" VALUE="click here" NAME="myButton" onClick="buttonClicked()">
</FORM&gt
Click the button below, in Netscape Navigator 4.x. You can see that the click event has been captured successfully, before it reaches the button. You can also observe that the click event was really intended for the button, otherwise every click in the window (outside the button) would have triggered an alert box:

Learn more about the event model in Netscape Navigator 4.x in Column 9, The Navigator Event Model.