HTML global attribute tabindex

The tabindex attribute controls the tab order in which the Tab key moves the focus through the HTML page, overriding the default order.

Syntax

<element tabindex="number">

Attribute Values

number: tab index

Browser compatibility


`tabindex`	Yes	Yes	Yes	Yes	Yes

Example

<!DOCTYPE HTML>
<html>
<body>
    <form>
        <label>Name:  <input type="text"  name="name" tabindex="1"/></label>
        <p/>
        <label>City:  <input type="text"  name="city" tabindex="-1"/></label>
        </p>
        <label>Country: <input type="text"  name="country" tabindex="2"/></label>
        </p>
        <input type="submit" tabindex="3"/>
    </form>
</body><!--from  ww w.jav  a 2  s  .  c o m-->
</html>

Click to view the demo

The first element that will be selected is the one that has the tabindex value of 1. When the user presses the Tab key, the element with a tabindex of 2 will be selected, and so on.

A tabindex value of -1 ensures that an element will not be selected when the user presses the Tab key.