0

リンクを使用して、ページのコンテンツセクションにジャンプしています。正常に動作します。ただし、IEとChromeでは、ジャンプした後、Tabキーを押すとに戻ります。

リンク ：<a href="#anchortext">Skip to Content</a>

コンテンツの場所<a id="anchortext" class='hidden'>Content</a>

何か案が？

4

3 に答える 3

4

ページ上の既存の html 要素のタブ インデックスに関係していると思われます。上記で指定したアンカー タグをクリックすると、関連するセクションに移動しますが、タブを押すと、最初に使用可能なタブに移動します。停止 (通常はリンクまたはフォームの入力項目) であり、ページの上部に非常に簡単に戻る可能性があります。

ページを更新してタブを1回押すと、ページの最初のタブインデックスが有効になっている要素に移動します-おそらく、元の質問で移動していたのと同じセクションになると思います...

于 2012-11-27T11:59:00.083 に答える
0

私の知る限り、htmlだけを使用してそれを行う方法はありません。

というわけで、jqueryを使ってJavaScriptスクリプトを作ってみました。ユーザーがジャンプ項目をクリックすると、次のリンクまたは特定の要素内の次のリンクを探して、それにフォーカスを置きます。これにより、Chrome (> 25) と IE (> 7) に関する私の問題が解決され、もちろん Firefox はタブ アクションを正しく解釈する優れた仕事をします。

$("#jumpToMenu").on("keydown", function(e) {
    var keyCode = e.keyCode || e.which;
    if(keyCode == 13) { 
        e.preventDefault();
        e.stopPropagation();
        $("#myMenuToJump").find('a:first').focus();
    }
}).on("click", function(e) {
    e.preventDefault();
    e.stopPropagation();
    $("#myMenuToJump").find('a:first').focus();
});

お役に立てれば...

于 2013-05-13T19:14:28.287 に答える
0

これは、ブラウザーでの内部リンクの処理の違いの問題であり、仕様で定義されていない動作のカテゴリに分類されるようで、ブラウザーに依存します。

リンクに (通常はタブを使用して) フォーカスし、Enter キーを押してリンクをたどると、ブラウザーはフォーカスを保持する場合と保持しない場合があります。のような CSS ルールを使用すると、動作の違いを確認できます:focus { background: yellow; }。

フォーカスが保持されている場合 (フォーカスされた要素が見えない可能性があるため、これはやや非論理的です)、タブはページ上の次のフォーカス可能な要素 (タブ順序の意味での「次」) に移動します。

フォーカスが失われた場合、ページ全体にフォーカスを与える (IE の奇妙さ)、またはフォーカスがないものとして扱われる可能性があります。いずれにせよ、タブを押すと、ページ上の最初のフォーカス可能な要素に移動します (タブの順序に従って)。

残念ながら、これを変更するためにページでできることは何もありません。ユーザーとブラウザの間にあります。

于 2012-11-28T07:54:05.533 に答える