tabindex="-1"

by @jehiah on 2005-09-28 13:29UTC
Filed under: All , HTML , IE , Firefox

This attribute (tabindex) specifies the position of the current element in the tabbing order for the current document. It’s normally a POSITIVE value between 0 and 32767, and when you tab between fields in a html form focus goes sequentially based on the tabindex values.

“0” is a special value though. When tabindex="0" the browser determines tab ordering based on the order of elements in the source code for a page. (the same thing happens when multiple elements have the same tab order).

”-1” is also a special value. You might notice however that it isn’t even valid. Some browsers (Internet Explorer and Firefox on a Mac) accept the value “-1” and elements with that index will not appear anywhere in the tab order of fields. You can not focus on those fields by tabbing from one to the next. This is great for removing extra buttons from the tab order so you can go from one field to the next. It just seems odd that it doesn’t work on Firefox on windows.

Thats great functionality, but it isn’t in the W3C spec

Workaround The workaround is easy. Just set the tabindex to an arbitrarily high number and the element(s) will be at the end of the tab index. Almost as good. It has the slight side affect of making those fields first when tabbing onto the form from the address bar. oh well.

Here is an example form. Try tabbing through in IE and Firefox (on win). The desired effect is to skip over the buttons when tabbing.



(ps if you have inputs on other browsers handle this, please speak up)

Browser support

  • Firefox (win) - un-supported
  • Firefox (mac) - supported
  • IE 6.0 - supported
Subscribe via RSS ı Email
© 2023 - Jehiah Czebotar