web-dev-qa-db-de.com

Bestimmen Sie, ob JavaScript e.keyCode ein druckbares Zeichen (kein Steuerzeichen) ist

Ich möchte nur die Bereiche von JavaScript keyCodes kennen, die typisierbaren Zeichen entsprechen. oder alternativ den Bereich nicht tippbarer (Steuer-) Zeichen wie Rücktaste, Escape, Befehl, Umschalttaste usw., damit ich sie ignorieren kann.

Der Grund, den ich frage, ist das Aufrufen von String.fromCharCode(), was zu ungeraden Zeichen für Steuertasten führt. Zum Beispiel bekomme ich "[" für den linken Befehl, "%" für den linken Pfeil. So eine Verrücktheit.

49
devios1

Keydown gibt Ihnen den keyCode der gedrückten Taste ohne Änderungen.

$("#keypresser").keydown(function(e){
    var keycode = e.keyCode;

    var valid = 
        (keycode > 47 && keycode < 58)   || // number keys
        keycode == 32 || keycode == 13   || // spacebar & return key(s) (if you want to allow carriage returns)
        (keycode > 64 && keycode < 91)   || // letter keys
        (keycode > 95 && keycode < 112)  || // numpad keys
        (keycode > 185 && keycode < 193) || // ;=,-./` (in order)
        (keycode > 218 && keycode < 223);   // [\]' (in order)

    return valid;
});

Nur die Zifferntasten, Buchstabentasten und die Leertaste enthalten Schlüsselcodes, die mit String.fromCharCode Korrelieren, da Unicode-Werte verwendet werden.

Tastendruck ist die Zeichencode-Darstellung des eingegebenen Texts. Beachten Sie, dass dieses Ereignis nicht ausgelöst wird, wenn infolge des Tastendrucks kein Text "gedruckt" wird.

$("#keypresser").keypress(function(e){
    var charcode = e.charCode;
    var char = String.fromCharCode(charcode);
    console.log(char);
});

http://jsfiddle.net/LZs2D/1/ Demonstriert, wie diese funktionieren.

KeyUp verhält sich ähnlich wie KeyDown.

82
Shmiddty

Nur für den Hintergrund gibt Ihnen das Ereignis "keypress" eine charCode -Eigenschaft, wenn Sie eine Zeichentaste drücken.

Editor.addEventListener('keypress', function(event){
    if (event.charCode) {
        //// character key
        console.log( String.fromCharCode(event.charCode) ); /// convert charCode to intended character.
    } else {
        //// control key
    }

Das "Tastendruck" -Ereignis erfasst jedoch nicht jeden Tastenanschlag - mehrere Tasten werden vor dem "Tastendruck" -Ereignis ausgelöst.

Im Gegensatz dazu erfasst das "keydown" -Ereignis jeden Tastenanschlag, hat jedoch keine charCode -Eigenschaft. Wie können wir also feststellen, ob es sich um einen Charakterschlüssel handelt? Es ist nicht optimal, bei jedem Tastendruck zu überprüfen, ob der keyCode für mehrere Bereiche innerhalb der unteren und oberen Schranken liegt. Ich vermute, dass es auch Probleme mit Zeichen außerhalb des Bereichs ASCII gibt.

Mein Ansatz ist die Überprüfung der Länge der Eigenschaft "Schlüssel" des Ereignisses. Die Eigenschaft "key" ist eine Alternative zu "keyCode", um zu bestimmen, welche Taste gedrückt wurde. Für Steuerungs- Schlüssel lautet die "Schlüssel" -Eigenschaft beschreibend (z. B. "rightArrow", "F12", "return" usw.). Für Zeichen Tasten ist die "Schlüssel" -Eigenschaft für einen Zeichenschlüssel nur das Zeichen (z. B. "a", "A", "~", "\" usw.) .). Daher hat die Länge der "key" -Eigenschaft für jeden Zeichenschlüssel die Länge 1; Steuerzeichen haben eine Länge von mehr als 1.

Editor.addEventListener('keydown', function(event){
    if (event.key.length == 1){ 
        //// character key
    } else {
        //// control key
    }
})
15
iamio

Dieser Artikel enthält eine Liste der keyCodes in Javascript:

http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes

4
Dave Zych

Sie können dazu auch RegEx verwenden:

$(".input").keyup(function (event) {
    if (event.key.match(/^[\d\w]$/i)) {
      // put function to trigger when a digit or a Word character is pressed here
    }

das Flag i unterscheidet zwischen Groß- und Kleinschreibung.

1
denkquer