Leitor de Teclas em Javascript e PHP

Publicado por Buckminster em 01/02/2023

[ Hits: 3.450 ]

5 0

Denuncie Favoritos Indicar Impressora

Leitor de Teclas em Javascript e PHP

Um código simples (como tantos outros) para capturar o KeyCode das teclas. Salve com a extensão .php ou .html.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" lang="pt-br">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Leitor de Teclas</title>
        <style>
            html {
              display: flex;
              align-items: center;
              justify-content: center;
              height: 100%;
              background: #FFD700;
              text-align: center;
              font-family: monospace;
              line-height: 1.4;
              font-size: 25px;
              color:blue;
            }
            pre {
              text-align: left;
            }
        </style>
        <script>
            document.addEventListener("keydown", function(event) {

              console.log(event);

              document.body.innerHTML = `

                <b>key (which): ${event.key}</b>
                <br>
                <b>which: ${event.which}</b>
                <br>
                <b>keyCode:</b> ${event.keyCode}
                <br>
                <b>shiftKey:</b> ${event.shiftKey}
                </br>
                <b>altKey:</b> ${event.altKey}
                <br>
                <b>ctrlKey:</b> ${event.ctrlKey}
                <br>
                <b>metaKey:</b> ${event.metaKey}
              `;

            });
        </script>
    </head>
    <body>
       Pressione uma tecla.
    </body>
</html>

Outras dicas deste autor

Recriar Links Simbólicos Quebrados

Atualizações de Segurança Automáticas no Debian

Mensagens criptografadas

Como resolver os erros 'a start job is running for wait for network to be configured' e 'a start job is running for raise network interfaces'

Habilitar módulo do kernel (sem o compilar completamente)

Leitura recomendada

Adicionar Facebook Comments no Google Sites

Codificação HEXADECIMAL para HTML

Atualizando conteúdo dinamicamente com jQuery

Aprendendo HTML

Copiando texto para área de transferência em JavaScript

Comentários

[1] Comentário enviado por maurixnovatrento em 01/02/2023 - 21:13h

Show mano.

___________________________________________________________
Conhecimento não se Leva para o Túmulo.
https://github.com/mxnt10

2 0

[2] Comentário enviado por Buckminster em 02/02/2023 - 12:24h

[1] Comentário enviado por mauricio123 em 01/02/2023 - 21:13h

Show mano.

___________________________________________________________
Conhecimento não se Leva para o Túmulo.
https://github.com/mxnt10

Obrigado.

0 0