December 30, 2000 - The Internet Explorer Event Model | WebReference

December 30, 2000 - The Internet Explorer Event Model

Yehuda Shiran December 30, 2000
The Internet Explorer Event Model
Tips: December 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

In order to understand the new event model in Netscape 6, you need to refresh your knowledge of how it is done in Internet Explorer. Internet Explorer introduced the concept of event bubbling. As oppose to Navigator where events propagate inward from the window object to the target object, an event in Internet Explorer bubbles from the target object outwards to the window object, propagating through all involved objects along the way. Each object can intercept the event and process it. Let's take an example. A paragraph includes a bold text. Both the paragraph tag (<P>) and the bold tag (<B>) have an onClick event handler attached to them. Both event handlers pop up an alert box. You can see by the order of the alert boxes that the bold text processes the event before the paragraph. Here is the HTML code:

<BLOCKQUOTE><P onClick="alert('Thank you for clicking somewhere in the paragraph.')">
This is a paragraph, and 
<B onClick="alert('Thank you for clicking somewhere in the bold section.')">
these are bold words in the paragraph</B>.</P></BLOCKQUOTE>
And here is the result. Try clicking the bold text:

This is a paragraph, and these are bold words in the paragraph.

Learn more about the event model in Internet Explorer in Column 10, The Internet Explorer Event Model.