tabindexを使ってみる
HTMLタグの属性に tabindex というものがあります。
TABキーでの移動順を指定するもので、 昔はIEだけだったのですが、最近ではFireFoxなどでも バッチリ対応されています。
これまた未対応のブラウザでも実害のないタグですので Webで業務システムを作る場合などは 使用を検討してみてください。
使い方は簡単です。
下のようなHTML書くだけで、フォーカスが、 text1→text3→text2の順番で移動します。
<input type="text" name="text1" tabindex="1"> <input type="text" name="text2" tabindex="3"> <input type="text" name="text3" tabindex="2">
下のサンプルのtext1にフォーカスをセットして Tabキーを押してみてください。 貴方のブラウザが対応していれば、text3にフォーカスが移動します。
横に並べると、あまり意味がありませんが ２列に配置したときなど役に立つときがあります。
ちなみに、tabindexに-1をセットすると 対応しているブラウザの場合、Tabキーではフォーカスがそこに移動しなくなります。
他にも、このtabindexは、 <p>タグなどでも使用することができます。 その場合、普段フォーカスがセットされない 文字にもフォーカスがセットされるので、 いつもと違う動きが面白いです。
