WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Activating onclick event via keyboard

for

Number of posts in this thread: 4 (In chronological order)

From: Weissenberger, Todd M
Date: Thu, Jun 27 2013 6:58AM
Subject: Activating onclick event via keyboard
No previous message | Next message →

As part of an ARIA test (aria-expanded) I'm using onclick to change the display property of a <div> that can receive focus. When NVDA is running, I can activate the widget using the Enter key, but when the screen reader is not running, only a mouse click will work. What gives?

Todd

T.M. Weissenberger
Web Accessibility Coordinator
University of Iowa
= EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
319-384-3323

From: Birkir R. Gunnarsson
Date: Thu, Jun 27 2013 7:06AM
Subject: Re: Activating onclick event via keyboard
← Previous message | Next message →

Todd

There are a few aria-expanded examples at www.3needs.org
Re the onClick event.
You need to code the div so that it listens for onKeydown for enter
and spacebar as well as a mouse click (codes 13 and 32).
For natively keyboard accessible html things, such as links or
buttons, you are set, but for divs you need to make sure these things
can be accessed via keyboard, for keyboard only users and those with
less savvy screen readers *grin*.
See this article for reference:
http://www.456bereastreet.com/archive/201302/making_elements_keyboard_focusable_and_clickable/


hth
-Birkir

Birkir R. Gunnarsson
Accessibility Subject Matter Expert | Deque Systems


On 6/27/13, Weissenberger, Todd M < = EMAIL ADDRESS REMOVED = > wrote:
> As part of an ARIA test (aria-expanded) I'm using onclick to change the
> display property of a <div> that can receive focus. When NVDA is running, I
> can activate the widget using the Enter key, but when the screen reader is
> not running, only a mouse click will work. What gives?
>
> Todd
>
> T.M. Weissenberger
> Web Accessibility Coordinator
> University of Iowa
> = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
> 319-384-3323
>
> > > >

From: Dylan Barrell
Date: Fri, Jun 28 2013 4:27AM
Subject: Re: Activating onclick event via keyboard
← Previous message | Next message →

Todd,

Take a look at this blog posting

http://unobfuscated.blogspot.com/2013/05/event-handlers-and-screen-readers.html

Essentially, only anchor tags will consistently fire a click event, for all
other tags, you need a keyboard handler.

--Dylan

From: Bryan Garaventa
Date: Fri, Jun 28 2013 10:55AM
Subject: Re: Activating onclick event via keyboard
← Previous message | No next message

Actually you can do the same thing with a Button element. A keyboard handler
is not necessary, nor for an Input tag with type=button or type=image. All
accept the click event from the keyboard.

This rule applies to elements that are natively non-active elements in the
browser, like Divs, Spans, etc.

----- Original Message -----
From: "Dylan Barrell" < = EMAIL ADDRESS REMOVED = >
To: < = EMAIL ADDRESS REMOVED = >
Sent: Friday, June 28, 2013 3:27 AM
Subject: Re: [WebAIM] Activating onclick event via keyboard


> Todd,
>
> Take a look at this blog posting
>
> http://unobfuscated.blogspot.com/2013/05/event-handlers-and-screen-readers.html
>
> Essentially, only anchor tags will consistently fire a click event, for
> all
> other tags, you need a keyboard handler.
>
> --Dylan
> > >