キーボードでフォームのフォーカス移動やsubmitをやりたい

キーボードでフォームのフォーカス移動や submit をやりたい

めちゃくちゃ初心者なので全然わからない。とりあえずわからないことをわからないと書く。

こういうのは HTML 側でうまくやれば良い感じになるのか……？と思い、まずはなんとなく知っている tabindex を調べる。

普通に 1, 2, 3...(もしくは 0 スタート)で数値を振ればその順番にタブキーを押してフォーカスが移るのかな？くらいの気持ちでいたけど、ちょっと違った。

-1 を指定すると、その要素にはタブキーを押して到達することはできないけどフォーカスはできる。

0 を指定すると、タブキーを押して到達することはできるが、順序が文書のソース内の順序になる。

1 以降は想定どおり。

という感じらしい。

tabindex の値に 0 よりも大きな値を使用することは避けてください。そうすると、支援技術に頼っている人がページコンテンツを移動したり操作したりすることが難しくなります。代わりに、論理的な順序で要素を並べて文書を書いてください。

つまり、基本的にキーボードによる到達を可能にしたいなら 0、したくないなら-1 を指定し、順番はソースコードを正しく書くことで担保してください。ということっぽい。なるほど。

他にも色々キーボードでの制御はあると思うけど、今日はひとまず tabindex について。