Wie kann ich Pfeiltastenanschläge in JavaScript und jQuery erfassen?

Pfeiltastenanschläge mit JS und jQuery erfassen

Das Binden von Funktionen an Pfeiltasten in Javascript und jQuery ist eine häufige Anforderung für die Tastaturnavigation. Während das js-hotkey-Plugin für jQuery die integrierte Bindefunktion erweitert, fehlt ihm die Unterstützung für Pfeiltasten.

Um dieses Problem zu beheben, finden Sie hier eine einfache Lösung:

<code class="javascript">document.onkeydown = function(e) {
    switch(e.which) {
        case 37: // left
        break;

        case 38: // up
        break;

        case 39: // right
        break;

        case 40: // down
        break;

        default: return; // exit this handler for other keys
    }
    e.preventDefault(); // prevent the default action (scroll / move caret)
};</code>

Dieser Code erfasst Tastenanschläge für die Pfeiltasten nach links, oben, rechts und unten mithilfe der switch-Anweisung. Sie können die gewünschten Aktionen für jeden Fall definieren.

Beachten Sie, dass Sie für Browser, die die Eigenschaft „which“ nicht unterstützen (z. B. IE8), den Funktionskörper wie folgt ändern:

<code class="javascript">document.onkeydown = function(e) {
    e = e || window.event;
    switch(e.which || e.keyCode) {
        case 37: // left
        break;

        // ...
    }
};</code>

Alternativ kann für moderne Browser die Eigenschaft KeyboardEvent.key zum Erkennen von Pfeiltasten verwendet werden, wie in diesem Beispiel gezeigt:

<code class="javascript">document.onkeydown = function(e) {
    switch(e.key) {
        case "ArrowLeft": // left
        break;

        // ...
    }
};</code>

Durch die Implementierung dieses Codes können Sie Funktionen mühelos an Pfeiltasten in Ihrem JavaScript binden oder jQuery-Anwendungen.

Das obige ist der detaillierte Inhalt vonWie kann ich Pfeiltastenanschläge in JavaScript und jQuery erfassen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!