Codi chiave JavaScript

L'unicode di tutte le chiavi della tastiera, inclusi numerici, alfabeti, caratteri speciali e così via "Keycodes". Come sappiamo, JavaScript è un linguaggio di scripting sul lato client, è spesso necessario conoscere il codice chiave associato a un carattere durante l'elaborazione di testo o caratteri immessi in un elemento del modulo su una pagina web.

Questo tutorial illustrerà l'uso dei codi chiave in JavaScript con esempi dettagliati. Quindi iniziamo!

Come utilizzare i codi chiave JavaScript?

Quando viene premuto o rilasciato un tasto tastiera, possono aver luogo tre diversi eventi sul lato client, keydown, keypress, keyup in ogni browser. Quando viene premuto un tasto tastiera, viene attivato l'evento keydown e immediatamente dopo, viene eseguito l'evento KeyPress. Quando viene rilasciata la chiave, viene attivato l'evento Keyup.

Questi eventi possono essere utilizzati per ottenere il codice chiave di una chiave a seconda dei requisiti. Dai un'occhiata agli esempi forniti per cancellare il tuo concetto.

Esempio 1: verificare quando un tasto viene premuto verso l'alto o premuto

In questo esempio, un messaggio verrà visualizzato sulla console quando il tasto viene premuto verso il basso e quindi premuto premendo e rilasciando il tasto sulla tastiera. Per fare ciò, in primo luogo, creeremo un intestazione e due campi di input con gli ID, "txt1" E "txt2":

Codi chiave JavaScript

Nel file JavaScript, prenderemo il primo campo di input usando "getElementById ()"Metodo passando ID"txt1"Come argomento e poi chiama il"addEventListener ()Metodo "in cui il"evento.PreventDefault ()"Il metodo verrà chiamato che controllerà quale tipo di evento viene attivato:

documento.getElementById ("TXT1").addEventListener ("keydown", function (event)
evento.preventDefault ();
console.log ('$ evento.tipo');
);

Allo stesso modo, faremo lo stesso per il secondo campo di input con ID "txt2":

documento.getElementById ("TXT2").addEventListener ("keyup", function (event)
evento.preventDefault ();
console.log ('$ evento.tipo');
);

Di conseguenza, l'output mostrerà "keydown"Messaggio sulla console quando il tasto viene premuto verso il basso, mentre il controllo del cursore si trova nel primo campo di input e quando verrà premuto un tasto nel secondo campo di input, non viene visualizzato alcun nuovo messaggio sulla console fino a quando il tasto non viene rilasciato e il rilascio "keyup"L'evento è attivato:

Vuoi recuperare il codice chiave quando viene premuto un tasto? Guarda il seguente esempio!

Esempio 2: Ottieni Unicode su KeyPress usando "Evento.quale attributo "

In questo esempio, cercheremo di ottenere l'Unicode dei tasti premendole in modo casuale. Per fare ciò, creeremo due etichette uno è per le istruzioni di stampa e l'altra stamperà gli Unicodes su una chiave di chiave:

Codi chiave JavaScript

Premere qualsiasi tasto per ottenere il codice di quel tasto:

Nel file JavaScript, accedi al "onkeydown"Proprietà del"documento"Oggetto che invoca la funzione"CheckCodeOfpressEdkey"Durante la pressione del tasto. Chiameremo il "evento.Quale"Attributo utilizzato per l'input del tasto della tastiera in quanto normalizza il"evento.chiave" E "evento.carbone" valori. La funzione restituirà il codice del tasto che verrà premuto:

documento.OnKeyDown = checkCodeOfpressEdkey;
functionCheckCodeOfpressEdkey (e)
VAR KEYCODE;
Se (finestra.evento)
KeyCode = finestra.evento.chiave;

elseif (e)
KeyCode = e.Quale;

documento.getElementById ("Unicode").InnerHtml = KeyCode;

Produzione

Abbiamo coperto tutte le informazioni essenziali relative ai codici chiave in JavaScript.

Conclusione

L'unicode di tutte le chiavi della tastiera, inclusi numerici, alfabeti e caratteri speciali, è chiamato "Keycodes". JavaScript è spesso necessario per conoscere il codice chiave associato a un carattere durante l'elaborazione di testo o caratteri immessi in un elemento di modulo su una pagina web. In questo tutorial, abbiamo illustrato l'uso dei codi key in JavaScript con esempi dettagliati.