 | JavaScript | |||
|---|---|---|---|---|
| Prev | Home | Up | Next |
The event handlers are many and various in their support across the browsers and in the way that they are triggered. There is no one object that supports them all and even when an object does not support them by default, the event-management capabilities of MSIE or Netscape can sometimes set objects up to support them anyway.
Here is a summary of the available supported events:
| Event | Handler | Usage |
|---|---|---|
| Abort | onabort | When image loading is aborted. |
| AfterPrint | onafterprint | When printing has just finished. |
| AfterUpdate | onafterupdate | When an update is completed. |
| Back | onback | The user has clicked on the [BACK] button in the toolbar. |
| BeforeCopy | onbeforecopy | Immediately before a copy to the clipboard. |
| BeforeCut | onbeforecut | Immediately before a cut to the clipboard. |
| BeforeEditFocus | onbeforeeditfocus | Immediately before the edit focus is directed to an element. |
| BeforePaste | onbeforepaste | Immediately before the clipboard is pasted. |
| BeforePrint | onbeforeprint | Immediately before printing begins. |
| BeforeUnload | onbeforeunload | Called immediately prior to the window being unloaded. |
| BeforeUpdate | onbeforeupdate | Called immediately before an update commences. |
| Blur | onblur | When an input element loses input focus. |
| Bounce | onbounce | Triggered when a marquee element hits the edge of its element area. |
| Change | onchange | When edit fields have new values entered or a popup has a new selection, this event's handler can check the new value. |
| Click | onclick | When the user clicks the mouse button on the Element object that represents the object on screen. |
| ContextMenu | oncontextmenu | Special handling for contextual menus. |
| Copy | oncopy | When a copy operation happens. |
| Cut | oncut | When a cut operation happens. |
| DataAvailable | ondataavailable | Some data has arrived asynchronously from an applet or data source. |
| DataSetChanged | ondatasetchanged | A data source has changed the content or some initial data is now ready for collection. |
| DataSetComplete | ondatasetcomplete | There is no more data to be transmitted from the data source. |
| DblClick | ondblclick | When the user double-clicks on an object. |
| Drag | ondrag | When a drag operation happens. |
| DragDrop | ondragdrop | Some data has been dropped onto a window. |
| DragEnd | ondragend | When a drag ends. |
| DragEnter | ondragenter | When a dragged item enters the element. |
| DragLeave | ondragleave | When a dragged item leaves the element. |
| DragOver | ondragover | While the dragged item is over the element. |
| DragStart | ondragstart | The user has commenced some data selection with a mouse drag. |
| Drop | ondrop | When a dragged item is dropped. |
| Error | onerror | Triggered if an error occurs when loading an image. |
| ErrorUpdate | onerrorupdate | An error has occurred in the transfer of some data from a data source. |
| FilterChange | onfilterchange | A filter has changed the state of an element or a transition has just been completed. |
| Finish | onfinish | A marquee object has finished looping. |
| Focus | onfocus | When the form element is selected for entry. |
| Forward | onforward | The user has clicked on the [FORWARD] button in the toolbar. |
| Help | onhelp | The user has pressed the [F1] key or selected [help] from the toolbar or menu. |
| KeyDown | onkeydown | When a key is pressed. |
| KeyPress | onkeypress | Pressing the key down and releasing it again elicits this event. |
| KeyUp | onkeyup | When a key is released. |
| Load | onload | When an object has completed loading. |
| LoseCapture | onlosecapture | When an element loses event capturing permission. |
| MouseDown | onmousedown | When the mouse button is pressed. |
| MouseDrag | onmousedrag | An event handler for mouse drag operations. |
| MouseMove | onmousemove | When the mouse pointer is moved. |
| MouseOut | onmouseout | When the mouse pointer leaves the active area occupied by the Element object that represents the object on screen. |
| MouseOver | onmouseover | When the mouse pointer enters the active area owned by the object. |
| MouseUp | onmouseup | When the mouse button is released. |
| Move | onmove | The browser window has been moved. |
| Paste | onpaste | When a paste operation happens. |
| PropertyChange | onpropertychange | When an object property is modified (similar to the Netscape watch() method). |
| ReadyStateChange | onreadystatechange | An object in the window has changed its ready state. |
| Reset | onreset | The user has clicked a reset button in a form. |
| Resize | onresize | As the window is resized, this event is triggered. |
| RowEnter | onrowenter | The data in a field bound to a data source is about to be changed. |
| RowExit | onrowexit | The data in a field bound to a data source has been changed. |
| Scroll | onscroll | The window has been scrolled. |
| Select | onselect | Some textual content in the window has been selected. |
| SelectStart | onselectstart | A select action is beginning. |
| Start | onstart | A marquee element is beginning its loop. |
| Stop | onstop | When a stop action occurs. |
| Submit | onsubmit | The user has clicked on the submit button in a form. |
| Unload | onunload | Triggered when the document is unloaded. |
Events are associated with HTML tags by means of the onEvent="..." tag attribute. This assigns a function object to the onevent property of the Element object that represents a tag. Event handlers can be associated with objects by assigning function object references to the event handler properties of the objects. However, this is also not consistently supported across the browsers.
Netscape supports event routing calls that can send events to objects by passing the Event object to them. The objects then map the events to an appropriate handler according to their set up.
The initial value of this property will be an anonymous function whose body contains the contents of the onEvent="..." HTML tag attribute.
When the event is triggered and called, it will execute in the context of the Element object and not the window. This means the execution scope will be that of the Element object.
In Netscape prior to version 6.0, event handlers are passed an event object as an argument when they are called. In MSIE, no object is passed but the equivalent event object is available as the event property of the window that contains the Element object that receives the event trigger.
On the return from a handler, other processing may take place. In pre-version 6.0 Netscape browsers, the general technique for this is to return a false value. Returning nothing is equivalent to returning true, which may allow some default processing in the browser to be called. In MSIE, this flag value is also supported, at least on later browser versions. In addition, the returnValue property of the event object can be set to false.
Now with the version 6.0 release of Netscape the DOM level 2 event model has been introduced. The event model is still undergoing some development at the W3C standards organisation and a level 3 update is available for review. This at least is a turning point for event handling because all browser manufacturers have stated that it is their goal to be standards-compliant. The new event model is mainly based on the MSIE way of doing things but it is a slightly hybrid and takes some ideas from the Netscape tradition too.
Prior to version 6.0 of Netscape, anything more than simple event handling is managed differently between the Netscape and MSIE browsers.
Properties that can be assigned with a function handler vary between Netscape and MSIE. Generally, MSIE allows this property assigning technique more completely and consistently across all its event handlers and objects that own them.
Be aware that you don't always get a meaningful Event object passed as an argument to the event handler in Netscape. On some platforms, the Event object may have some useful properties, on others it may have none. The MSIE Event object is more complete but less flexible as it needs to be shared between all events.
Event handling support has radically changed in Netscape 6.0, and because it is a new code base and a new standard, there are likely to be bugs and limitations in its support for a while yet.
| See also: | Element.onevent, Event object |
| Prev | Home | Next |
| OL.type | Up | onAbort |
JavaScript Programmer's Reference, Cliff Wootton Wrox Press (www.wrox.com) Join the Wrox JavaScript forum at p2p.wrox.com Please report problems to support@wrox.com © 2001 Wrox Press. All Rights Reserved. Terms and conditions. | ||