spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / javascript / column11


Capturing an Event at a High Level

Developer News
News Flash: Adobe Has iPhone Workaround
Adobe's Flash 10.1 Goes Mobile (Minus iPhone)
A Salute to Visionary CEOs

You may recall from Column 9 that Navigator 4.0x requires the captureEvents() method to capture events outside of its intended target (in the window, layer, or document object). For example, the following code segment captures all mouseup events in the document:

document.captureEvents(Event.MOUSEUP);
document.onmouseup = functionName;

Since Internet Explorer 4.0x's event model is based on event bubbling, an event is first directed to its intended target (the element that initiated the event). Therefore, the captureEvents() method is not featured in Internet Explorer 4.0x. It simply isn't required. As a scripter, you must make sure it is not executed under Intenet Explorer. The best way to do this is object detection, as described in Column 6. The following statements define a cross-browser event capturing routine:

if (window.Event) // Navigator 4.0x
  document.captureEvents(Event.MOUSEUP);
document.onmouseup = functionName;

On Internet Explorer 4.0x and older browsers (Navigator and Internet Explorer), only the second statement is executed. Therefore this script is also backward compatible. In other words, it does not generate an error on older browsers. It obviously doesn't work with such browsers, because they do not support the onmouseup event handler with the document object. Note that under some circumstances, the onclick event handler doesn't work properly with the document object on Navigator 4.0x, so we'll use the onmouseup event handler instead. The following script is a complete example that demonstrates the object detection routine:

<SCRIPT LANGUAGE="JavaScript">
<!--

function processClicks() {
  alert("You released the mouse button.");
}

if (window.Event) // Navigator 4.0x
  document.captureEvents(Event.MOUSEUP);
document.onmouseup = processClicks;

// -->
</SCRIPT>

When the user clicks the mouse button anywhere in the page's background, the script generates an alert dialog box provided that the user is running a fourth-generation browser.

http://www.internet.com

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Building a Banking Application Home Page with OOP · Mixing Scripting Languages · Review: phpFox, a Social Networking CMS with all the Bells and Whistles
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Enterprise 2.0: Social Networking in the Cloud · BroadSoft Marketplace Hastens Pace of Telephony Innovation · Review: HTC Hero for Sprint


Created: January 13, 1998
Revised: January 18, 1998

URL: http://www.webreference.com/js/column11/capture.html