3

以下のコードでは、ユーザーがスクリーン リーダーを使用してナビゲートしているmyHyperlink.onclick場合、ハイパーリンクをたどってイベントをキャンセルすると、JavaScript は引き続き実行されますか? 私の目標は、スクリーン リーダーを使用してナビゲートしているユーザーが直接ナビゲートできるようにするhttp://www.google.comことです。

<!DOCTYPE html>
<html>
 <head>
     <title>Accessibility?</title>
     <script>
     window.onload = function() {
         var myHyperlink = document.getElementById("slider-nav");
         myHyperlink.onclick = function() {
             document.getElementById("about-google").style.display = "block";
             return false;
         };
     };
     </script>
 </head>
 <body>
     <div id="main">
         <a href="http://www.google.com" id="slider-nav">Google</a>
         <div id="about-google" style="display:none;">
             <a href="http://www.google.com">
                 <img src="https://www.google.com/images/srpr/logo3w.png" alt="Google logo" />
             </a>
         </div>
     </div>
 </body>
</html>

JSFiddle からもコードを入手できます。

コンテキストとして、カルーセル/スライダー ウィジェットをよりスクリーン リーダーに適したものにしようとしています。

4

1 に答える 1

3

目の見えるユーザーがマウスでリンクをアクティブにするか、目の見えるユーザーがキーボードを使用するか、スクリーン リーダーがキーボードを使用してリンクをアクティブにするかにかかわらず、ブラウザーの動作に違いはありません。いずれの場合も、onclickハンドラーが呼び出され、ロゴが表示され、ナビゲーションがキャンセルされます。キーボードを使用する場合 (目が見えるかどうかに関係なく)、キーボード フォーカスは最初のテキスト リンクにとどまります。目が見えるユーザーには新しい画像が表示されますが、スクリーンリーダーのユーザーには何も聞こえず、なぜ何も起こらなかったのか不思議に思うかもしれません。

これは自分で試すことができます:無料の NVDA スクリーンリーダーをダウンロードし(役に立つと思ったら寄付してください)、IE または Firefox で実行されているページに対して試してみてください (アクセシビリティに対する Chrome のサポートは少し遅れていますが、追いついています.)多くの場合、ペインとしてではなく、スタンドアロン ページで結果を操作する方が簡単です。これを行うには、フレーム URL を取り出して新しいブラウザー ページ ( http://fiddle.jshell) に貼り付けます。あなたの場合はnet/DXUqr/show/です。NVDA だけがスクリーンリーダーというわけではありませんが、基本的な Web アクセシビリティをチェックするために使用するのに適しています。

(一般的に言えば、そもそもユーザーがスクリーンリーダーを使用しているかどうかを判断することはできません。最善の策は、すべてのユーザーにとって機能するアクセシブルな HTML を作成することです。)

于 2012-11-15T11:37:03.563 に答える