7

div内にボタンのコレクションがあり、矢印キーイベントに応答してボタン間でフォーカスを移動するjavascriptがあります。

これを NVDA/Firefox/Windows でテストすると、NVDA が矢印キー ハンドラーをオーバーライドし、独自のルールに従ってフォーカスを移動するようです。私のウィジェットは高度にカスタマイズ可能で、動的で、応答性が高いため、これは問題です。そのため、フォーカスを移動するためのルールは非常に複雑です。

Voiceover にも ChromeVox にもこの動作はありません。

各ボタンに role="gridcell" を追加するとこれが修正されるように見えますが、スクリーンリーダーが私のボタンをボタンとして扱わないことを意味するため、そうしないことをお勧めします。また、絶対に必要でない限り、html 構造を変更したくありません (たとえば、各ボタンを別の要素にラップするなど)。

ボタンに独自の矢印キーの動作を適用しないように NVDA に指示する方法 (たとえば、aria または独自の属性) はありますか?

4

2 に答える 2

6

ユーザーの予想される動作を上書きすると、まったく使用できない、またはアクセスできないインターフェイスが作成されるリスクがあることを考慮してください。

これをやろうとしないことを強くお勧めします。

とにかく、それをオーバーライドしようとして追加した ARIA は、非 NVDA ユーザーに影響を与える可能性があります。NVDA は矢印キーをインターセプトするため、NVDA が矢印キーに反応するまで JavaScript は動作しません。

NVDA ユーザーは、bとShift+を使用してボタン間を移動できるbため、 に依存する必要はありませんTab。

以上のことから、 WAI-ARIA Authoring Practicesで達成しようとしているものに似た既存のパターンが見つかるかもしれません。

目標を概説し、例を​​示すことができれば、壊れた経験を危険にさらすことなく目標を達成できるようにする既存のパターンまたは手法を特定できる可能性があります.

于 2017-01-05T03:20:12.213 に答える
4

すべてのボタンがコンテナー (span または div) 内にある場合、そのコンテナーに role=application を追加すると、すべてのキーボード イベントが支援技術ではなくアプリケーションに強制的に送られます。ただし、 Role=application は慎重に使用する必要があります。

<div role=application>
   <button>alpha</button><br>
   <button>beta</button><br>
   <button>gamma</button><br>
</div>
于 2017-01-07T15:55:59.277 に答える