HTML where will the focus go next if I press tab?

Question

Hi all,

Is there some way of knowing where will the focus jump to when the tab key key will be pressed and certain element has the focus?

I am thinking on something to be used this way:

var nextElement = whereWillFocusJumpTo(currentElement);

Thanks!

Answer 1

Maybe you can use the DOM to enumerate the inputs on the page and read the tabindex property.

Answer 2

So long as you have set the tabindex for all objects on the page, you will be able to use javascript to find the next increment from the current object.

Answer 3

Use HTML's TABINDEX attribute to control where the tab goes.

<input name="email" tabindex="1"></input>
<input name="phone" tabindex="2"></input>

Answer 4

I think you could use the jquery.Listen library to accomplish this.

Something like this:

jQuery('table').listen( 'focusin', 'tr', function(){
    alert("you've focused on a row!");
});

Answer 5

The algorithm for determining the tab order is here:-

   http://dev.w3.org/html5/spec/editing.html#sequential-focus-navigation

One thing to note is that if more than one element has a tabindex of 0, the tab order is platform dependent, so you may wish to ensure that all focusable elements on your page have a non-zero tabindex.

Answer 6

It would be very complicated to do this via script, essentially (typically) input types (including select, textarea, button) etc along with links (a tags) and label tags bound to an input tag are able to be focused, unless the tabindex property is set, the next tag in your markup that is one of the above types/conditions will be the next focused.