テキストエリアのタブキーをオーバーライドするアクセス可能な方法
ユーザーが押すことを可能にするコード用のテキストエリアを作成したい Tab そして Shift + Tab コンテンツをインデントおよびアウトデントするには、それぞれ、しかし、私はオーバーライドすることを心配しています Tab キーを押すと、キーボードでページを移動しようとしている人のために、ページにフォーカストラップが作成されます。
のデフォルトの動作をオーバーライドするアクセス可能な方法はありますか Tab <textarea>？
私の最初の考えは使用することでした Ctrl + Tab そして Ctrl + Shift + Tab フィールドフォーカスを変更するが、この決定の結果がわからない。
WAI-ARIA 1.0 Authoring Practices ガイドの多くを読んだ後、 明示的な推奨方法があることに気付きましたリッチテキストの編集可能なドキュメントへのタブの挿入を処理するには ：
オプションで、開発者がドキュメントにタブを挿入する機能を提供したい場合は、次のいずれかの方法を使用することをお勧めします。
- メニューにインデントとアウトデントのボタンを提供します。ボタンへのキーボードショートカットは Control+M インデントと Control+Shift+M インデント用。
- メニューにボタンを提供して、タブの使用を2つのモード間で切り替えます。このボタンを使用すると、 Control+M ボタンを切り替えるキーボードショートカットとして推奨されます。
タブキーの修飾子は、重要なウィンドウ管理タスクのために既に使用されています。
Ctrl+Tab 同じアプリケーションで開いているドキュメントを循環するための一般的なショートカットであるため、ブラウザのタブを循環します。 Shift+Ctrl+Tab 後退します。 Alt+Tab 実行中のアプリケーションを切り替えます。
1つのWebページがウィンドウ管理のショートカットに影響を与えることは、予期せぬことであり、非常に煩わしいことです。私はフラッシュビデオプレーヤーがそれをするのを見ました、そしてそれは良くありません。
アサナ 逆にして使用します Tab ショートカットの修飾子として。
考慮すべきもう一つは、多くのコーダーにとって Tab 純粋に筋肉メモリです。彼らはインデントのために何を打つべきかについて考えていません。単に他に必要なものがある場合 Tab、彼らはおそらくそれを使用するのに苦労するでしょう。したがって、場合によっては、デフォルトの動作をオーバーライドしても、他の方法よりも悪くない場合があります。 Github は、オンラインコードエディターでそれを行います。とは異なる何かに対処する必要がある Tab ユーザーベースの99％はひどく迷惑になります。彼らのエディターは多くのコードの作成をサポートするように設計されていたため、デフォルトの動作よりも重要であると彼らは考えていました。
単に使用することからの変更 Tab 人々が慣れ親しんでいるものとは異なるので、完全に異なる組み合わせを使用することもできます。
あなたは使うことができます Ctrl+Space そして Shift+Ctrl+Space。
大きなフォームの一部である短いスニペットの場合、このアプローチは良い妥協案になるかもしれません。実際、私は多くのプログラマーが、スペースバーを何百回も叩かなければならないこと以外に、あらゆる種類の適切なインデントのサポートを喜んで見ると思います。
プランBは、モードスイッチを追加することです。ユーザーがインデントの編集を有効にするかどうかをユーザーに決定させます Tab、またはデフォルトの動作のままにします。これにより、ユーザーがフォームをタブで移動するときにテキスト領域に行き詰まるのを防ぐだけでなく、数行以上のコードを記述する必要があるときに適切なインデントに簡単にアクセスできます。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
つかむだけ Tab 何かが入力された後のフィールド。この方法では、キーボードショートカットを使用してページを移動しても問題はありません。
また、何が起こっているのかユーザーに手がかりを与えてください。さもなければ、動作はかなり不安定に見えるかもしれません。フォームフィールドナビゲーションではなく、インデントのためにタブがロックされているというフィードバックを提供します。 Koen Lngeveenの回答 には、このような良い例があり、「Tab [リリース]のインデントに使用できるようになりました。