什么是tabindex呢？ 我们把tabindex拆开来就很容易理解了： tab表示键盘上的TAB键， index 表示索引，合在一起表示按下tab键时控键被选中的顺序。
下面给出两个例子，反复按一下你的tab键试一试吧。
<a href="http://duanwz.com">短网址</a>
<a href="http://www.im286.com">落伍者</a>
<a href="http://www.m4j5.com">美食江湖</a>
<a href="http://duanwz.com" tabindex=”1">短网址</a>
<a href="http://www.im286.com" tabindex=”3">落伍者</a>
<a href="http://www.m4j5.com" tabindex=”2">美食江湖</a>
在第一个例子中，当你反复按下tab键时，这几个元素按照”短网址”->” 落伍者” ->”美食江湖”的顺序被依次选中;而在第二个例子中，被选中的顺序是”短网址”-> ”美食江湖”-> ” 落伍者”，这个顺序正好是三个连接的tabindex值按从小到大的顺序。
通过上面的对比，我们很容易得出一个结论：tabindex的大小决定了你反复按下tab键时元素(控件)被选中的先后顺序，tabindex的值越小就越被先选中。
在这个例子中也许你会觉得对链接使用tabindex意义不大，我只是拿这个例子来说明tabindex的作用，下面我们看一个更实际的例子：
用户名<input type="text" /><br />
密码<input type="password" /> <a href="http://www.m4j5.com/signup.php">忘记密码</a>
<br />
<input type="submit" value="登陆" />
这是一个很常见的登陆页面表单的一部分（我省去了一些不必要的元素和属性）。通常对于表单的填写，我习惯于使用tab 键来切换不同的field(域)。拿这个例子来讲，我填好用户名后按一下tab键切换到密码框，填好密码后再按一下tab键，直到把这个表单填完后把焦点切换到登陆按钮，然后按一下回车。通过使用tab键来切换域和通过鼠标点击来切换域的效果大家应该能比较出来的。我们再回到这个例子中，不难发现出现了一点小瑕疵：当我填完了密码后按一下tab，这时焦点跳转到了“忘记密码”上去了，显然这和我的预期是不一样的，我希望焦点能够切换到登陆按钮上去。如何去解决这个问题呢？这是tabindex就要上场了。
这里需要指出两点：
不光只有链接有tabindex，还有其它元素AREA， BUTTON， INPUT， OBJECT， SELECT， and TEXTAREA也有这个属性；
tab键会对那些有tabindex属性的元素优先照顾。
让我们来修复上面的小瑕疵：
用户名<input type="text" tabindex="1" /><br />
密码<input type="password" tabindex="2" /> <a href="http://www.m4j5.com/signup.php">忘记密码</a>
<br />
<input type="submit" value="登陆" tabindex="5" />
在这个例子中“忘记密码”没有tabindex属性，所以当你填完“密码”按下tab时会优先照顾有tabindex的“登陆”按钮。OK，问题已经解决了。
其他需要注意的地方：
- tabindex的值介于0~ 32767之间；
- 如果tabindex为0，相当于不设置 tabindex；
- tabindex起始值可以为任意值；
- 多个元素的tabindex 可以不连续，比如在上面的例子中“登陆”被设置为了5，这样可以方便的在登陆和“密码”之间方便的插入新元素；
- 如果多个元素的tabindex的相同，那么将这些元素将按照出现的先后顺序获得焦点；
- 对于disabled的元素，tabindex无效，即无论何值都不会获得焦点
