DOM Event Reference

This chapter describes the DOM Level 2 Event Model as implemented by Gecko. The event object itself is described, as well as the interfaces for event registration on other nodes in the DOM, event handers and event listeners, and several longer examples that show how the various event interfaces relate to one another.

• DOM Event Interface
• DOM Event Handler List

DOM Event Interface

---

The DOM Event interface is exposed in the event objects that are passed to the event handlers on various elements in the DOM. The following very simple example shows how an event object can be referenced and manipulated from within one such event handler.

function foo(e) {   // event handling functions like this one   // get a reference to the event they handle   // (in this case as "e").   alert(e); } table_el.onclick = foo;

This example is woefully simplistic, but it shows an important feature of events in the Gecko DOM, which is that event objects in the DOM are typically accessed in the event handler functions. Once you have a reference to the event object, you can access all of the properties and methods described in this chapter.

Also see Example 5: Event Propagation in the Examples chapter for a more detailed example of how events move through the DOM.

In addition to the event object described here, the Gecko DOM also provides methods for registering event listeners on nodes in the DOM, removing those event listeners, and dispatching events from the DOM. These and the various Event Handlers on HTML or XML elements are the main entry points for events in the DOM. These three methods are described in the DOM Element Reference chapter of this book.

Properties

altKey	Returns a boolean indicating whether the <alt> key was pressed during the event.
bubbles	Returns a boolean indicating whether the event bubbles up through the DOM or not.
cancelBubble	Returns a boolean indicating whether the bubbling up of the event has been canceled or not.
cancelable	Returns a boolean indicating whether the event is cancelable.
charCode	Returns a number representing the character that was pressed as part of the key event.
clientX	Returns the horizontal position of the event.
clientY	Returns the vertical position of the event.
ctrlKey	Returns a boolean indicating whether the <ctrl> key was pressed during the event.
currentTarget	Returns a reference to the currently registered target for the event.
detail	Returns detail about the event, depending on the type of event.
eventPhase	Used to indicate which phase of the event flow is currently being evaluated.
isChar	Returns a boolean indicating whether the event produced a key character or not.
keyCode	Returns a number representing the character that was pressed as part of the key event.
layerX	Returns the horizontal coordinate of the event relative to the current layer.
layerY	Returns the vertical coordinate of the event relative to the current layer.
metaKey	Returns a boolean indicating whether the meta key was pressed during the event.
pageX	Returns the horizontal coordinate of the event relative to the page
pageY	Returns the vertical coorindate of the page relative to the page.
relatedTarget	Identifies a secondary target for the event.
screenX	Returns the horizontal position of the event on the screen.
screenY	Returns the vertical position of the event on the screen.
shiftKey	Returns a boolean indicating whether the <shift> key was pressed when the event was fired.
target	Returns a reference to the target to which the event was originally dispatched.
timeStamp	Returns the time that the event was created.
type	Returns the name of the event (case-insensitive).
view	The view attribute identifies the AbstractView from which the event was generated.

Methods

initEvent	The initEvent method is used to initialize the value of an Event created through the DocumentEvent interface.
initMouseEvent	This method intializes the value of a mouse event once it's been created
initUIEvent	Initializes a UI event once it's been created.
preventDefault	Cancels the event (if it is cancelable).
stopPropagation	Stops the propagation of events further along in the DOM.