tabindex=n - タブ順序制御

• トップ
• HTMLリファレンス
• tabindex=n

属性

サポート

説明

TABキーを押した時に tabindex で指定した数値の小さなもの順にフォーカスが移動します。

HTML4.0以降、IE4.0 以降でサポートされています。IE5.0 からは、<b> や <p> など大半のタグで tabindex の指定が可能になりました。現在では、Chrome, Firefox, Safari, Opera などでもサポートされています。

tabindex に -1 を指定すると、そのオブジェクトにフォーカスが移動しなくなります。

使用例

キーボードで TABキーを押した際に、ボタン → セレクトボックス → テキストボックス の順にフォーカスが移動します。

<form action="#">
  <input type="text" tabindex="3"><br>
  <input type="button" tabindex="1" value="OK"><br>
  <select tabindex="2"><option>XXX</select><br>
</form>

リンク

• https://html.spec.whatwg.org/multipage/interaction.html#attr-tabindex
• https://developer.mozilla.org/ja/docs/Web/HTML/Global_attributes/tabindex
• https://caniuse.com/tabindex-attr