Como converter um KeyCode para ASCII com JavaScript

Escrito por kevin lee | Traduzido por josé fabián
  • Compartilhar
  • Tweetar
  • Compartilhar
  • Pin
  • E-mail
Como converter um KeyCode para ASCII com JavaScript
JavaScript é uma linguagem de programação usada em páginas web (Comstock/Comstock/Getty Images)

A possibilidade de detectar as pressões de teclas de um visitante do seu site pode ajudá-lo a criar aplicações web mais interativas. Um videogame, por exemplo, precisará saber quais teclas o usuário digita, para controlar o jogo. Os navegadores conhecem os valores decimais desses caracteres. O valor 68, por exemplo, representa o "D" maiúsculo em ASCII. Você pode examinar os valores e convertê-los para seus equivalentes em ASCII usando JavaScript.

Nível de dificuldade:
Moderado

Outras pessoas estão lendo

Instruções

  1. 1

    Inicie seu editor de HTML e abra um documento.

  2. 2

    Crie uma caixa de texto adicionando este código à seção "body" do seu documento:

    <input type="text" size="20" onkeyup="showKeyPressed(event);" />

    O evento "onkeyup" chamará a função "showKeyPressed" de JavaScript quando você digitar alguma coisa na caixa.

  3. 3

    Adicione o código seguinte à seção "<head>" do documento:

    function showKeyPressed(e) {

    var keyPressed; if (e.keyCode) keyPressed = e.keyCode; else keyPressed = e.charCode;

    var keyASCII = String.fromCharCode(keyPressed); alert("Keycode = " + keyPressed + " - Its ASCII value is " + keyASCII); }

    Essa função recebe o evento "onkeyup" enviado pela caixa de texto e converte o conteúdo para ascii por meio da função "fromCharCode".

  4. 4

    Salve seu documento e visualize-o em um navegador. Digite qualquer caractere na caixa de texto. Aparecerá uma mensagem de alerta mostrando o valor numérico da tecla pressionada junto ao valor ASCII dessa.

Dicas & Advertências

  • Esse exemplo mostrou como examinar as pressões de teclas em uma caixa de texto e convertê-las para ASCII. Isso funciona também com outros controles, como o "textarea" (área de texto). Adicione o evento "onkeyup="showKeyPressed(event)";" na tag do HTML, e a função de JavaScript processará o evento como acontece com a caixa de texto. O seguinte código mostra como configurar um controle "textarea":

Não perca

Filtro:
  • Geral
  • Artigos
  • Slides
  • Vídeos
Mostrar:
  • Mais relevantes
  • Mais lidos
  • Mais recentes

Nenhum artigo disponível

Nenhum slide disponível

Nenhum vídeo disponível