TabIndex is an attribute to HTML elements that tells the browser which control takes focus next when TAB is pressed.

<input id="one" tabindex="3" />

<input id="two" tabindex="1" />

<input id="three" tabindex="2" />

<input id="four" tabindex="4" />

Here, once the page is loaded, the first TAB press will set focus to input two, and then subsequent presses will move the focus to three, one and then four – before returning to two.

In a static web page it can be useful, but in a dynamic page, then this is a truely awful way of moving around.Especially as a web browser will automatically give the controls their own order, naturally in the order that they appear in the HTML source.

So why use it? I have no idea. I have never needed this attribute, and cannot ever see me ever using it.

I’ve just had to remove all the wonky tabindex’s from a huge page. Luckily I use an IDE that lets me search and replace using regular expressions! Online Regular Expression Testing Tool