ajaxonclickaccessibilityscreen-readersprogressive-enhancement

Prevent screen-readers / assistive tech from triggering click handler


I have this link:

<a href="/path/to/page" data-trigger="expedient-element">The Best Page</a>

The ajax-populated and -revealed element that exists within the current page is an "enhancement" and has aria-hidden="true". It would be preferable for screen-readers and assistive tech to follow the link's href to the subsequent static page, rather than triggering the click handler (especially since the element that it will acts on is already hidden, as previously mentioned).

Will this behavior already take place or do I need to add something?


Solution

  • When pressing enter on a link, it does the same as a click, and it's a very bad idea to intercept the enter key in order to do something different.

    By the way, you can't do something different based on whether a screen reader is used or not, simply because you have no 100% reliable way to detect it.

    The questions you should ask yourself are: