0

複数のページを持つasp.net MVCプロジェクトがあります。ページごとに、一部のコントロール間のみ移動するように TAB キーを設定する必要があります。私は設定できることを知っています：

tabIndex=x , x > 0 //to enable
tabIndex=-1, //to disable

問題は、TAB キーが機能する 5 つのコントロールと機能しないコントロールが 50 あることです (数字は比率を理解するためのものです)。そのため、ページ全体 (*.css またはマネージャーから) の TAB キーを無効にし、それを必要とするいくつかの特定のコントロールに対してのみ有効にする方法があるかどうか疑問に思っていました。

4

2 に答える 2

0

タブ化してはならない要素が非常に多いため、代わりに TAB キーを無効にするか、tabIndex、onkey が押された要素のデフォルトの動作を変更しました。

1) tabIndex が 0 より大きいすべての要素を取得しました。

var tabbables = document.querySelectorAll("input[tabindex], textarea[tabindex]");

これは簡略化されたバージョンです。可視性チェックを行い、他のタイプの要素 (ボタンなど) も選択する必要があります。

2) TAB が押されてタブ インデックスを持つ最後の要素が選択されるか、SHIFT + TAB が押されて最初の要素が選択されるという 2 つのケースで、デフォルトの動作を置き換えました。これらのケースでは、最初の要素と最後の要素にそれぞれフォーカスを当てました。

非常に良い答えを持つ同様の質問（受け入れられた答えではなく、最も投票数の多い答え）は次のとおりです：「タブインデックスの次の要素にフォーカス」

于 2013-01-03T08:22:48.267 に答える
0

私の知る限り、これはおそらくあなたが望むほど直接的に行うことはできません。タブ インデックスが設定されていないすべての要素に対して JS 関数を実行し、ゼロ未満に設定することを検討できます。

var elements = document.querySelectorAll("input:not([tabindex])");
for (var i = 0; i < elements.length; i++) {
    elements[i].tabindex = -1;
}

要素の数によっては、パフォーマンスが低下する可能性があるため、ベンチマークを検討する必要があることに注意してください。

考慮できる他のオプションは、要素のタブ インデックスを無効にする HTML ヘルパー サーバー側を作成することです。Razor@helper構文を使用してローカルでヘルパーを実行するか、HtmlHelper クラスの拡張メソッドを使用してグローバルにヘルパーを実行できます。これは JS よりもはるかに優れたパフォーマンスを発揮しますが、シナリオによっては少し手間がかかる場合があります。

于 2012-12-14T09:06:02.077 に答える