WebAIM - Web Accessibility In Mind

E-mail List Archives

Moving the focus from a list with links to the content area


From: Nancy Johnson
Date: Dec 16, 2013 9:07AM

I have a question regarding moving the focus from a list with links to
the content area in the following screnario.
Links within a UL going to one AJAX enabled content on right with a
jquery click event to bring in the correct content.

Currently, keyboard user clicks on a link the content area displays,
the user still has to tab through the remaining links to get to the
content area.

The developer is using id='inlinewrapper' to call the correct content via ajax.

Adding live regions: no affect on tabbing, the screen reader was able
to immediately read the content, when I started tabbing, it went back
to the list and finished.

The html is somthing like : second item is active here.

<div class="search-outer">
<a id="abc" href="javascript:void(0)">ABC</a>

<a id="def" class="sactive" href="javascript:void(0)">DEF</a>

<a id="ghi" href="javascript:void(0)">GHI</a>


<script type="text/javascript">
jQuery(document).ready(function () {
var options_def = {};
options_def.jqueryaction = "anchor";
options_def.id = "csSearch";
options_def.targets = "inlinewrapper";
options_def.href = "SearchSafetyIssues";
options_def.hrefparameter = "partialPage_YN=Y&prodType=def";
options_def.onclick = "menuClick";

div id="inlinewrapper" class="inlinewrapper">
<div id="def">
two to three input fields