OnClick Server Post

Onclick event handlers are triggered within certain applications to enable a variety of different client side functionality. SSB has tested onclick events for accessibility and created a list of concerns regarding their appropriate use within a web site or application.

Onclick Function

An onclick event fires when the mouse is “clicks” on an element, a form element is selected using the Enter key, or the access key for an element is activated. This causes certain cases, specifically when used within form elements, that make the usage of onclick a difficulty for assistive technology users.

Problem Areas

Form submission or navigation

When the onclick event handler is used with a selection element (such as drop down menu or radio button list) to force form submission or navigation an assistive technology user’s focus will shift without their interaction. Generally speaking this will cause focus to shift to the beginning of the new page. This is confusing to a user of assistive technology and often causes the users to “get lost” within an application or site.

SSB recommends removing the onclick event handlers when they are used for navigation or forced form submission. An appropriately labeled element separate from the selection element should be provided that triggers the form post or navigation.

Keyboard Accessibility

The action of the onclick event handler must be configured to ensure it can be accessed from the keyboard. In the even of form controls selected using “Enter” to handle selection this is a generally not a problem. If, however, container or text elements, such as DIV or SPAN, are used then an appropriate keyboard alternative, such as “onkeypress”, should be provided to ensure the action is accessible from the keyboard.

Content Changes

The page author must ensure that when content is updated using the onclick event handler this content is available to users of assistive technology. Generally this means updating the appropriate textual item to ensure it accurately reflects the state after it has been altered with the onclick. For example an element that is selected after an onclick event should have a textual description that updates it’s reflected state.

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request


Help Desk | 800.889.9659
© 2005 - 2015 - SSB BART Group. All rights reserved.
Privacy | Security | Credits | License
Powered by Zendesk