keyCode-Ereigniseigenschaft

事件对象参考手册Event-Objekt

Beispiel

Ermitteln Sie den Unicode-Wert der gedrückten Tastaturtaste:

var x = event.keyCode;

xDas Ausgabeergebnis ist:

119 // 119 ist das Zeichen "w"

Selbst ausprobieren »

Dieser Artikel enthält unten weitere Beispiele.

Definition und Verwendung

Die keyCode-Eigenschaft gibt beionkeypressden Zeichencode des Tastenwerts zurück, der das Ereignis ausgelöst hat, oder beionkeydownoderonkeyupden Tastencode des Ereignisses.

Der Unterschied zwischen den beiden Codetypen ist:

  • Zeichencode - eine Zahl, die ein ASCII-Zeichen darstellt
  • Tastaturcode - eine Zahl, die die tatsächliche Taste auf der Tastatur darstellt

Die beiden Arten von Werten sind nicht immer gleich. Zum Beispiel haben Kleinbuchstabe "w" und Großbuchstabe "W" denselben Tastaturcode, weil sie dieselbe Taste auf der Tastatur sind (der Code für "W" ist "87"), aber sie haben unterschiedliche Zeichencodes, und die Ausgabe der beiden Zeichen ist unterschiedlich (die Zeichencodes für "w" und "W" sind "119" und "87") - siehe die Beispiele unten zum besseren Verständnis.

Tipp:Wenn Sie wissen müssen, ob der Benutzer eine druckbare Taste (wie "a" oder "5") gedrückt hat, wird empfohlen, das onkeypress-Ereignis zu verwenden. Wenn Sie wissen müssen, ob der Benutzer eine Funktionstaste (wie "F1", "CAPS LOCK" oder "Home") gedrückt hat, können Sie das onkeydown- oder onkeyup-Ereignis verwenden.

Hinweis:In Firefox ist die keyCode-Eigenschaft im onkeypress-Ereignis ungültig (gibt 0 zurück). Für Browser-Kompatibilität können Sie sowohlwhichals auch die keyCode-Eigenschaft zusammen verwenden, um das zu lösen:

var x = event.which || event.keyCode; // verwendetwhichoderkeyCode, auf diese Weise können verschiedene Browser unterstützt werden

Tipp:Eine Liste aller Unicode-Zeichen finden Sie in unseremvollständigen Unicode-Referenzhandbuch。

Tipp:Wenn Sie einen Unicode-Wert in ein Zeichen umwandeln müssen, können Sie diefromCharCode()-Methode verwenden.

Hinweis:Diese Eigenschaft ist schreibgeschützt.

Hinweis:Die Eigenschaften which und keyCode bieten eine Möglichkeit, die Browserkompatibilität zu erreichen. Die neueste Version der DOM-Ereignisse empfiehlt, diekey-Eigenschaft zu verwenden, um diese Methode zu ersetzen.

Tipp:Wenn Sie prüfen möchten, ob die Taste "ALT", "CTRL", "META" oder "SHIFT" gedrückt wird, können Sie die altKey-, ctrlKey-, metaKey- oder shiftKey-Eigenschaft verwenden.

Browser-Unterstützung

Eigenschaft
keyCode Ja Ja Ja Ja Ja

Syntax

event.keyCode

Technische Details

Rückgabewert: Eine Zahl, die einen Unicode-Zeichencode oder einen Unicode-Tastencode darstellt
DOM-Version: DOM Level 2 Events

实例

Weitere Beispiele

Beispiel

Verwenden Sie onkeypress und onkeydown, um den Unterschied zwischen Zeichencodes und Tastencodes zu veranschaulichen:

<input type="text" onkeypress="uniCharCode(event)" onkeydown="uniKeyCode(event)">

function uniCharCode(event) {
    var char = event.which || event.keyCode;
    document.getElementById("demo").innerHTML = "Unicode-ZEICHEN-Code: " + char;
}

function uniKeyCode(event) {
    var key = event.keyCode;
    document.getElementById("de2").innerHTML = "Unicode-TASTEN-Code: + key;
}

Wenn die "a"-Taste auf der Tastatur gedrückt wird (ohne Caps Lock), lautet die Ausgabe wie folgt:

Unicode-Zeichencode: 97
Unicode-Tastencode: 65

Selbst ausprobieren »

Beispiel

Wenn die Esc-Taste gedrückt wird, erscheint eine Hinweismeldung:

<input type="text" onkeydown="myFunction(event)">

Funktion myFunction(event) {
    var x = event.keyCode;
    if (x == 27) {  // 27 ist die ESC-Taste
        alert ("Sie haben die Escape-Taste gedrückt!");
    }
}

Selbst ausprobieren »

Beispiel

Einen Unicode-Wert in ein Zeichen umwandeln (nicht für Funktionstasten verfügbar):

var x = event.key;                // Den Unicode-Wert abrufen
 var y = String.fromCharCode(x);       // Wert in ein Zeichen umwandeln

Selbst ausprobieren »

Verwandte

HTML-DOM-Referenzhandbuch:key-Ereignis-Eigenschaft

HTML-DOM-Referenzhandbuch:keyCode-Ereignis-Eigenschaft

HTML-DOM-Referenzhandbuch:which-Ereignis-Eigenschaft

事件对象参考手册Event-Objekt

Andere Erweiterungen