onKeyPress vs. onKeyUp und onKeyDown

Question

Worin besteht der Unterschied zwischen diesen drei Ereignissen? Beim Googeln habe ich das gefunden:

• El onKeyDown Ereignis wird ausgelöst, wenn der Benutzer eine Taste drückt.
• El onKeyUp Ereignis wird ausgelöst, wenn der Benutzer eine Taste loslässt.
• El onKeyPress Ereignis wird ausgelöst, wenn der Benutzer eine Taste drückt und loslässt ( onKeyDown gefolgt von onKeyUp ).

Die ersten beiden Punkte verstehe ich, aber ist nicht onKeyPress dasselbe wie onKeyUp ? Ist es möglich, einen Schlüssel freizugeben ( onKeyUp ), ohne sie zu drücken ( onKeyDown )?

Das ist ein bisschen verwirrend, kann mir das jemand erklären?

Answer 1

この Artikel von Jan Wolter ist der beste Beitrag, auf den ich gestoßen bin, Sie können die archivierte Kopie finden aquí wenn der Link tot ist.

Sie erklärt alle wichtigen Ereignisse des Browsers sehr gut,

El Taste unten Ereignis tritt ein, wenn die Taste gedrückt wird, unmittelbar gefolgt von dem Tastendruck-Ereignis. Dann wird das keyup Ereignis wird erzeugt, wenn der Schlüssel freigegeben wird.

Zum Verständnis des Unterschieds zwischen Taste unten y Taste drücken ist es sinnvoll, zu unterscheiden zwischen Zeichen y Tasten . A Schlüssel ist eine physische Taste auf der Tastatur des Computers. A Zeichen ist ein Symbol, das durch Drücken einer Taste eingegeben wird. Auf einer US-Tastatur bedeutet das Drücken der Taste 4 Taste bei gedrückter Shift Taste erzeugt normalerweise ein "Dollarzeichen". Dies ist nicht unbedingt auf jeder Tastatur der Welt der Fall. Theoretisch kann die Taste unten y keyup Ereignisse stehen für das Drücken oder Loslassen von Tasten, während die Taste drücken Ereignis stellt ein Zeichen dar, das getippt wird. In der Praxis wird dies nicht immer so gehandhabt.

Eine Zeit lang haben einige Browser ein zusätzliches Ereignis ausgelöst, das textEingabe , unmittelbar nach Taste drücken . Frühe Versionen des DOM-3-Standards sahen dies als Ersatz für die Taste drücken Veranstaltung, aber die ganze Idee wurde später widerrufen. Webkit unterstützte dies zwischen den Versionen 525 und 533, und mir wurde gesagt, dass IE es unterstützte, aber ich habe das nie entdeckt, möglicherweise weil Webkit erforderte, dass es aufgerufen wird textEingabe während der IE es als Texteingabe .

Es gibt auch ein Ereignis namens Eingabe die von allen Browsern unterstützt wird und die unmittelbar nach einer Änderung an einer textarea oder Eingabefeld. Normalerweise wird ein Tastendruck ausgelöst, dann erscheint das getippte Zeichen im Textbereich, und dann wird die Eingabe ausgelöst. Die Website Eingabe Ereignis gibt eigentlich keine Informationen über die getippte Taste - man müsste das Textfeld inspizieren, um herauszufinden, was sich geändert hat - daher betrachten wir es nicht wirklich als Tastenereignis und dokumentieren es hier nicht wirklich. Obwohl es ursprünglich nur für Textareas und Eingabefelder definiert wurde, glaube ich, dass es eine gewisse Tendenz gibt, es zu verallgemeinern, damit es auch bei anderen Arten von Objekten ausgelöst wird.

Answer 2

Aktualisierte Antwort:

KeyDown

• Feuert mehrmals, wenn Sie die Tasten gedrückt halten.
• Zündet die Metataste.

KeyPress

• Feuert mehrmals, wenn Sie die Tasten gedrückt halten.
• Hat nicht Metaschlüssel abfeuern.

KeyUp

• Brände einmal am Ende, wenn Sie die Taste loslassen.
• Zündet die Metataste.

Dies ist das Verhalten in beiden addEventListener y jQuery .

https://jsbin.com/vebaholamu/1/edit?js,console,output <-- Beispiel versuchen

(Antwort wurde mit korrekter Antwort, Screenshot und Beispiel bearbeitet)

Answer 3

Es scheint, dass onkeypress und onkeydown das Gleiche tun (mit dem kleinen Unterschied der oben bereits erwähnten Tastenkombinationen).

Sie können dies versuchen:

<textarea type="text" onkeypress="this.value=this.value + 'onkeypress '"></textarea>
<textarea type="text" onkeydown="this.value=this.value + 'onkeydown '" ></textarea>
<textarea type="text" onkeyup="this.value=this.value + 'onkeyup '" ></textarea>

Sie werden sehen, dass die Ereignisse onkeypress und onkeydown beide ausgelöst werden, während die Taste gedrückt wird und nicht, wenn die Taste gedrückt wird.

Der Unterschied besteht darin, dass das Ereignis nicht nur einmal, sondern viele Male ausgelöst wird (solange Sie die Taste gedrückt halten). Seien Sie sich dessen bewusst und behandeln Sie sie entsprechend.

Answer 4

Das Ereignis onkeypress funktioniert für alle Tasten außer ALT, CTRL, SHIFT, ESC in allen Browsern, während das Ereignis onkeydown für alle Tasten funktioniert. Bedeutet onkeydown Ereignis erfasst alle Tasten.

Answer 5

Ich wollte nur eine Neugierde teilen:

Wenn Sie das onkeydown-Ereignis verwenden, um eine JS-Methode zu aktivieren, ist der Zeichencode für dieses Ereignis NICHT derselbe wie der, den Sie bei onkeypress erhalten!

Zum Beispiel geben die Zifferntasten dieselben Zeichencodes zurück wie die Zifferntasten über den Buchstabentasten, wenn onkeypress verwendet wird, aber NICHT, wenn onkeydown verwendet wird!

Ich brauchte einige Sekunden, um herauszufinden, warum mein Skript, das auf bestimmte Zeichencodes prüfte, bei der Verwendung von onkeydown fehlschlug!

Demo: https://www.w3schools.com/code/tryit.asp?filename=FMMBXKZLP1MK

und ja. Ich weiß, dass die Definition der Methoden unterschiedlich sind.. aber die Sache, die sehr verwirrend ist, ist, dass in beiden Methoden das Ergebnis des Ereignisses mit event.keyCode abgerufen wird.. aber sie geben nicht den gleichen Wert zurück.. nicht eine sehr deklarative Implementierung.