Come convertire KeyCode in ASCII con JavaScript

October 12

La capacità di rilevare i tasti del visitatore del sito può aiutare a costruire più applicazioni Web interattive. Un programma di gioco, per esempio, può essere necessario conoscere i personaggi un utente preme per controllare il gioco. I browser conoscono i valori decimali di questi personaggi. Il valore decimale 68, per esempio, rappresenta il carattere ASCII maiuscolo "D." L'applicazione può esaminare questi valori decimali e convertirli in loro equivalenti ASCII utilizzando JavaScript.

istruzione

1 Avviare il editor HTML e aprire un documento HTML.

2 Creare una casella di testo aggiungendo questo codice alla sezione "corpo" del documento:

<Input type = "text" size = "20" onkeyup = "showKeyPressed (evento);" />

L'evento "onKeyUp" chiama la "showKeyPressed" funzione JavaScript quando si digita qualcosa nella casella di testo.

3 Aggiungere questo codice JavaScript alla sezione del documento "<head>":

Funzione showKeyPressed (e) {

var keyPressed;

if (e.keyCode)

keyPressed = e.keyCode;

altro

keyPressed = e.charCode;

var = KeyAscii String.fromCharCode (keyPressed);

alert ( "Keycode =" + keyPressed + "- il suo valore ASCII è" + KeyAscii);

}

Questa funzione riceve il "onkeyup" evento inviato dal casella di testo e lo converte in ASCII utilizzando la funzione "fromCharCode".

4 Salvare il documento e visualizzarlo in un browser. Digitare qualsiasi carattere nella casella di testo. Un messaggio di avviso viene visualizzato il valore numerico del tasto premuto insieme al valore ASCII della chiave.

Consigli e avvertenze

  • Questo esempio mostra come esaminare sequenze di tasti inseriti in una casella di testo e convertirli in ASCII. Questo funziona con altri controlli di input, così come scatole textarea. Basta aggiungere il onkeyup = "showKeyPressed (evento);" evento al tag HTML, e la funzione JavaScript potranno elaborare l'evento proprio come si fa con la casella di testo. La seguente dichiarazione mostra come configurare un controllo textarea:
  • <Textarea id = righe "TextArea1" = "2" cols = "20" onkeyup = "showKeyPressed (evento);"> </ textarea>