tabindexBootstrap 3 の属性は何のために使用されるのでしょうか?
実質的にすべてのモーダルでそれらを使用しているにもかかわらず、ドキュメントにはそれらについて何も記載されていません。
私はこれについての使用法についてしか知りませんでしたが、あまり意味がありません
キーボードや支援技術のユーザー向けのアクセス可能なツールチップ
キーボードで操作するユーザー、特に支援技術を使用するユーザーの場合は、リンク、フォーム コントロール、または tabindex="0" 属性を持つ任意の要素など、キーボードでフォーカス可能な要素にのみツールチップを追加する必要があります。
ベストアンサー1
この
tabindex属性は、ページ内のフォーカス可能な要素 (通常はリンクとフォーム コントロール) のナビゲーション順序を明示的に定義します。また、要素がフォーカス可能かどうかを定義するためにも使用できます。[両方]
tabindex="0"と はtabindex="-1"特別な意味を持ち、HTML で異なる機能を提供します。 の値は0、要素をデフォルトのナビゲーション順序に配置する必要があることを示します。これにより、ネイティブでフォーカス可能でない要素 (<div>、、<span>など<p>) がキーボード フォーカスを受け取ることができます。もちろん、一般的にはすべてのインタラクティブ要素にリンクとフォーム コントロールを使用する必要がありますが、これにより他の要素がフォーカス可能になり、インタラクションをトリガーできるようになります。価値
tabindex="-1"デフォルトのナビゲーションフローから要素を削除します（つまり、ユーザーはタブでそこへ移動できない）が、プログラム的な焦点を受け取ることができるつまり、リンクまたはスクリプトからフォーカスを設定できます。** これは非常にタブで移動すべきではないが、フォーカスを設定する必要がある要素に役立ちます。。良い例はモーダルダイアログウィンドウ- 開いたときに、フォーカスをダイアログに設定してスクリーンリーダーを起動します。読むそしてキーボードが始まりますナビゲートダイアログ内。ダイアログ (おそらく単なる
<div>要素) はデフォルトではフォーカスできないため、ダイアログを割り当てると、ダイアログがtabindex="-1"表示されたときにスクリプトでフォーカスを設定できるようになります。の値は
-1、矢印キーやその他のショートカットキーウィジェット内の 1 つの要素のみが Tab キーで移動可能であることを確認しつつ、ウィジェット内の他のコンポーネントにフォーカスを設定できるようにします。
ソース： http://webaim.org/techniques/keyboard/tabindex
そのため、ユーザーが一般的なマウスとキーボードのショートカットにアクセスできるように、tabindex="-1"モーダルが必要になります。<div>