Gilt für alle Inhalte, die Skripte benutzen, um Funktionalitäten zu implementieren.
Die Technik bezieht sich auf:
Das Ziel dieser Technik ist es, die Benutzung von sowohl Tastatur-spezifischen als auch Maus-spezifischen Events mit Code, der eine verbundene Scripting-Funktion hat, zu erläutern. Die Benutzung von sowohl Tastatur-spezifischen als auch Maus-spezifischen Events zusammen stellt sicher, dass Inhalt mit einer Vielzahl an Geräten bedient werden kann. Beispielsweise kann ein Skript bei Feststellung eines Tastendrucks die gleiche Handlung ausführen, die ausgeführt wird, wenn eine Maus-Schaltfläche gedrückt wird. Diese Technik geht über die Anforderung des Erfolgskriteriums für den Zugriff per Tastatur hinaus, indem nicht nur der Zugriff per Tastatur, sondern auch der Zugriff über andere Geräte vorgesehen ist.
Häufig benutzte Event-Handler in JavaScript umfassen onblur, onchange, onclick, ondblclick, onfocus, onkeydown, onkeypress, onkeyup, onload, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, onreset, onselect, onsubmit, onunload. Einige Maus-spezifische Funktionen haben eine logische entsprechende Tastatur-spezifische Funktion (wie zum Beispiel 'onmouseover' und 'onfocus'). Es sollte ein Tastatur-Event-Handler, der die gleiche Funktion wie der Maus-Event-Handler ausführt, zur Verfügung gestellt werden.
Die folgende Tabelle gibt Empfehlungen zur Paarung von Tastatur-Event-Handlern mit Maus-Event-Handlern.
| Benutzen Sie... | ...mit |
|---|---|
mousedown | keydown |
mouseup | keyup |
click [1] | keypress [2] |
mouseover | focus |
mouseout | blur |
1 Obwohl click hauptsächlich ein Maus-Event-Handler ist, verarbeiten die meisten HTML- und XHTML-Benutzeragenten diesen Event, wenn das Steuerelement aktiviert wird, egal ob es per Maus oder Tastatur aktiviert wurde. Daher ist es in der Praxis nicht notwendig, diesen Event zu duplizieren. Er ist der Vollständigkeit halber hier aufgeführt, da nicht-HTML-Benutzeragenten dieses Problem haben.
2 Da der keypress-Event-Handler auf jede Taste reagiert, sollte die Event-Handler-Funktion zuerst kontrollieren und sicherstellen, dass die Eingabetaste gedrückt wurde bevor damit fortgefahren wird, den Event zu verarbeiten. Andernfalls läuft der Event-Handler jedes Mal, wenn der Benutzer eine Taste drückt, sogar wenn die Tabulatortaste gedrückt wird, um das Steuerelement zu verlassen, und dies ist normalerweise nicht gewünscht.
Einige Maus-spezifische Funktionen (wie zum Beispiel dblclick und mousemove) haben keine entsprechende Tastatur-spezifische Funktion. Dies bedeutet, dass einige Funktionen unter Umständen für jedes Gerät unterschiedliche implementiert werden müssen (zum Beispiel die Aufnahme einer Reihe von Schaltflächen, um per Tastatur die äquivalenten, implementierten Maus-spezifischen Funktionen auszuführen).
In diesem Beispiel eines Bildlinks wird das Bild geändert, wenn der Benutzer den Zeiger über dem Bild positioniert. Um Tastaturbenutzern ein ähnliches Erlebnis zu bereiten, wird das Bild auch geändert, wenn der Benutzer per Tab dorthin geht.
Code-Beispiel:
<a href="menu.php" onmouseover="swapImageOn('menu')" onfocus="swapImageOn('menu')"
onmouseout="swapImageOff('menu')" onblur="swapImageOff('menu')">
<img id="menu" src="menu_off.gif" alt="Menu" />
</a>Dieses Beispiel zeigt ein Bild, für das die Tastatur benutzt werden kann, um die Funktion zu aktivieren. Der Maus-Event onclick wird durch den passenden Tastatur-Event onkeypress dupliziert. Das tabindex-Attribut stellt sicher, dass die Tastatur einen Tabstop auf dem Bild hat. Beachten Sie, dass in diesem Beispiel die nextPage()-Funktion prüfen sollte, ob die auf der Tastatur gedrückte Taste die Eingabetaste war, ansonsten wird auf alle Tastendrücke reagiert, während das Bild den Fokus hat, was nicht das gewollte Verhalten ist.
Code-Beispiel:
<img onclick="nextPage();" onkeypress="nextPage();" tabindex="0" src="arrow.gif"
alt="Go to next page"> Anmerkung: Dieses Beispiel benutzt tabindex auf einem img-Element. Auch wenn dies derzeit ungültig ist, wird dies als vorübergehende Technik bereitgestellt, um dafür zu sorgen, dass die Funktion funktioniert.
Ressourcen sind nur zu Informationszwecken und keine offizielle Empfehlung.
Finden Sie alle interaktiven Funktionalitäten
Prüfen Sie, ob auf alle interaktiven Funktionalitäten über die Tastatur alleine zugegriffen werden kann
#2 ist wahr.
Wenn dies eine ausreichende Technik für ein Erfolgskriterium ist, dann bedeutet das Scheitern an diesem Testverfahren nicht zwangsläufig, dass das Erfolgskriterium nicht auf irgendeine andere Art und Weise erfüllt wurde, sondern nur, diese Technik nicht erfolgreich implementiert wurde und nicht benutzt werden kann, um die Konformität zu erklären.