NOTE: Tabindex support is included in most versions of Internet Explorer, but is only supported by Mozilla browsers that are version 1.8 and higher. View this onclick with onKeyPress example View this device-independent onclick example
DHTML QUICKMENU CODE
In other words, for a link that uses ?onclick?, if tabbing to a link and pressing the Enter key will cause the onclick event to occur - then the script functionality can be operated via the keyboard without requiring the developer to code the second redundant "onKeyPress" event for the same element.Įxample 1 below below uses onclick as a device-independent link, which is executed when the Enter Key is used to select the element: This is because the link or form control will gain focus when navigating with the keyboard. In this case, onclick acts in a device-independent manner, and is therefore directly accessible. Specifying the event handler onclick on a link or form element should cause the browser to evoke the event if either the mouse or the Enter key is used to select it. Onclick is an example of an event handler that sometimes behaves as a device-independent handler and in other cases as a device dependent handler. If the browser does not simulate the mouse event when the keybord is used, then the keyboard event must also be specified. For example, "onKeyDown" should not be specified with "onMouseDown" because it will cause two events to be submitted to the server when the Enter key is pressed: one for the onKeyDown event because the user pressed down the Enter key and a simulated mouse click provided by the browser for onMouseDown. Two events might cause a problem in the server logic when only one is expected. If it does, then specifying the mouse event is sufficient. Therefore, device-dependent event triggers must be tested to determine if the browser simulates the event with the keyboard as a redundant input mechanism. Browsers will sometimes map the pressing of the keyboard Enter key to mouse events. Test device-dependent event triggers to determine if an additional keyboard event is needed. The image-swap below can be executed with a mouse or with a keyboard. In addition, because this is essentially an ?image-swap?, alt text must be added to the image, so that visually impaired users have access to the content as well.
To make this type of functionality accessible, onfocus and onblur must also be used. In the following example, the developer wants additional text to be displayed when a user with a mouse puts the cursor over the image (onmouseover). In HTML 4.01, device-independent event handlers are onfocus, onblur (the opposite of onfocus), and onselect. Use device-independent event handlers rather than, or in addition to, device-dependent event handlers.Refer to the onclick technique below for more information.įor event handlers that do more than just change the presentation of an element, content developers are required at a minimum to use one or more of the following techniques: The onclick event handler can be either device-dependent, or device-independent, depending on its usage. Examples of these device-independent event handlers include: onfocus, onblur, and onselect. Other event handlers are device-independent and are triggered by both the mouse and keyboard or by other means. Using device-dependent event handlers may cause the content to be inaccessible to someone who cannot use the device that is required for that specific event handler. These are called device-dependent event handlers, and include onmouseover, onmouseout, and ondblclick. Some event handlers are dependent upon use of a mouse or keyboard. Event handlers accompany HTML code and are triggered by a browser or user event - such as when the page loads, when the user clicks the mouse, or when the time is 8 p.m.