Skip to main content
tabindex attribute | tabIndex property

Sets or retrieves the index that defines the tab order for the object.

Syntax

HTML<element tabindex="p" ... >
JavaScript

p = object.tabIndex

Property values

Type: Number

the tab index.

0

Default.

Remarks

The tabIndex value determines the tab order as follows:

  1. Objects with a positive tabIndex are selected in increasing p order and in source order to resolve duplicates.
  2. Objects with an tabIndex of zero are selected in source order.
  3. Objects with a negative tabIndex are omitted from the tabbing order.

An element can have focus if the tabIndex property is set to any valid negative or positive integer.

The following elements can have focus and are tab stops by default: a, BODY, button, frame, iframe, img, input, isIndex, object, select, textArea.

The following elements can have focus by default but are not tab stops. These elements can be set as tab stops by setting the tabIndex property to a positive integer. applet, div, frameSet, span, table, td.

Setting the tHead and tFoot elements to participate in the tab order will not cause the focus rectangle to display when either receives focus.

Examples

This example uses the tabIndex property to specify the tab order for three text fields. In addition, the Submit button is removed by specifying a negative value.


<input type="text" tabindex="1"> 
<input type="text">
<input type="text" tabindex="2"> 
<input type="submit" tabindex="-1">

This example uses the tabIndex property to assign a tab order to an unordered list. To cycle through the list's tab order, the user presses the TAB key. Since the list items can have focus, the focus rectangle surrounds each item the user selects.


<ul>
	<li>Item 1 (no tab)</li>
	<li>Item 2 (no tab)</li>
	<li>Item 3 (no tab)</li>
</ul>
<ul>
	<li tabindex="1">Tab Item 1</li>
	<li tabindex="2">Tab Item 2</li>
	<li tabindex="3">Tab Item 3</li>
	<li tabindex="4">Tab Item 4</li>
	<li tabindex="5">Tab Item 5</li>
</ul>

See also

a
abbr
address
area
b
bdo
blockQuote
body
button
caption
cite
custom
dd
del
dfn
div
dl
dt
em
fieldSet
form
frame
hn
hr
i
iframe
img
input type=button
input type=checkbox
input type=email
input type=file
input type=image
input type=number
input type=password
input type=radio
input type=range
input type=reset
input type=search
input type=submit
input type=tel
input type=text
input type=url
ins
kbd
label
legend
li
menu
object
ol
p
pre
q
rt
ruby
s
samp
select
small
span
strong
sub
sup
table
tBody
td
textArea
tFoot
th
tHead
tr
u
ul
var