Warum sollte ein `a` Tag` tabindex = 0` brauchen?

Question

Ich arbeite an einer Web-App, und einer der wiederholten a (Anker) -Elemente bekommt nicht den Tastaturfokus, wenn ich die Seite durchblättere. Nur wenn ich tabindex=0 hinzufüge kann ich es tab.

(Obwohl mein Ziel im Fokus sichtbar zu machen ist, ich bin zu bestimmen, ob ein Element, indem Sie einen Ausschnitt von jQuery konzentrieren wird:

// Whenever I hit tab, show me which element has focus 
$('main').on('keydown',function(e) { 
    var keyCode = e.keyCode || e.which; 

    if (keyCode == 9) { 
    console.log("focus is now on ", $(':focus')); 
    } 
}); 

)

Das verwirrt mich. Nach , "Das Tabindex-Attribut kann auch jedes Element in interaktiven Inhalt machen" - aber a ist eine der Listen, die sie standardmäßig als interaktiv auflisten.

Und wieder von einem Zugänglichkeit Artikel:

A [tabindex] Wert von 0 bedeutet, dass das Element in der Standardnavigations Reihenfolge platziert werden soll. Auf diese Weise können Elemente, die nicht nativ fokussierbarem (wie <div>, <Spannweite> und <p>) sind Tastaturfokus zu erhalten. Natürlich sollte man in der Regel verwenden, Links und Formular-Steuerelemente für alle interaktiven Elemente ... (http://webaim.org/techniques/keyboard/tabindex)

Was ein Ankerelement dazu führen würde, wie ich Reiter durch die interaktiven Elemente einer Seite zu überspringen?

Answer 1

Wie pro Ihre Frage:

Was wäre ein Ankerelement dazu führen, als ich durch die Registerkarte interaktive Elemente einer Seite übersprungen werden?

Wenn Sie tabindex="-1" hinzufügen, wird das Element übersprungen.
Und wenn Ihr <a> Tag keine href hat, wird es auch übersprungen.

Answer 2

Wenn ein Tabindex von "-1" verwendet wird, ist das Element, auf das es angewendet wird, nicht mehr auf die Tastatur fokussierbar.

Sie können die W3C specification dafür überprüfen.