Leitor de Teclas em Javascript e PHP

Publicado por Buckminster em 01/02/2023

[ Hits: 2.870 ]

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

Kubernetes, amplo material completo da CNCF com ferramentas e suas instalações, incluindo suporte à OpenAPI

Desligar Windows remotamente pelo Linux

Instalar Popcorn-Time no Linux

Mensagens criptografadas

Instalar Google Chrome no Slackware 15

Leitura recomendada

Como corrigir erros de acentuação em códigos HTML, PHP ou JavaScript

Codificação HEXADECIMAL para HTML

Copiando texto para área de transferência em JavaScript

Adicionar Facebook Comments no Google Sites

Can I use - Checar compatibilidade de comandos HTML5, CSS, JavaScript e outros

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

1 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