简体   繁体   中英

How can I make screen reader NVDA reads ENTER key when press it on listitem (ARIA)?

I'm trying since yesterday to make it work, but i can't. The problem is: I have a list of items that you can tab and select one of them with ENTER key, but the ScreenReader doesn't read anything when you press ENTER key to the selected item.

I tried many things, aria-selected="false" (which only works with buttons, but i'm trying to do this with an <a> , so it doesn't work), javascript, aria-atomic="true" but enter key doesn't reads in nvda(screenreader)

This is the piece of code that i'm trying to fix

<div class="SelectedNames"> <ol> <li ng-repeat="name in names" ng-class"isSingleNameSelected(name) == true? 'selected': no-selected'" ng-click="verifySelected(name)"> <a href="%" class="nameTitle> {{ item.name }}</a>

I'm modifying inside of the part. Because i guess that it can work without touching the rest of the code

I don't mind if you can show me another way like javascript without aria to do this. I only need it to works when you press enter to an item in the listitem I will apreciate if someone can discover how to fix it, because i can't. Thank you

Your question is not very clear. But I understand you want the 'click' functionality to work on hitting the 'enter' button too. If my understanding is correct, you need to add the (keypress) event.

Seems like you are using Angular (since i can see ng-repeat and all). So your code can change to this to support Keyboard accessible.

This is called Keyboard accessibility:

// Only Mouse click event 

<li (click)="callSomeFunction($event)"> 
   Some LI item
</li>


// Mouse click and Keyboard accessible event
<li (click)="callSomeFunction($event)" (keypress)="callSomeFunction($event)"> 
   Some LI item
</li>

What (keypress) will do is, whenever you press any button on the keyboard, it will call that function.

There are 2 more events which you can use: (keyup) and (keydown) which will let you control the calling of the function after the pressing of the key is done or during the pressing of the key. You may use whatever you want to achieve the above functionality.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM