Capturar Tecla Con JavaScript

Hola , este post va a ser muy corto , aquí os dejo el ejemplo de como se captura una tecla usando javascript.

Yo utilizo el IDE Visual Studio pero puedes hacerlo con cualquiera, he creado un aspx simple para añadir un div y un textbox para mostar la tecla capturada sin tener que ejecutar el codebehind

Bien aqui el aspx con el javascript que necesitas y comentado para que puedas entenderlo, es fácil

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 
    <title>tecla presionada soulsmakers.com</title>
    <%--Creamos la seccion Scripts vamos lo de siempre--%>
      <script type="text/javascript">
          //Al documento le añadimos una nueva funcion suscrita al evento keydown, tambien
          //esta el Keyup y el key press
          document.addEventListener('keydown', function (e) {
              //Dependiendo del navegador usara el which o el keycode OJO ES IMPORTANTE
              var keycodeentero = event.which || event.keyCode;
              //Buscamos el objeto tecla
              var objeto = document.getElementById('tecla');
              // Y con el String obtenemos la tecla presionada.
              objeto.textContent = 'La tecla presionada es: ' + String.fromCharCode(keycodeentero);
          })
            </script>
</head>
<body>
    <form id="form1" runat="server">
         
        <div style="text-align:center;width:100%;margin-top:10%;font-size:20pt">
            <asp:Label ID="tecla" runat="server" Text="s"></asp:Label>
        </div>
    </form>
</body>
</html>

<!DOCTYPE html>

<title>tecla presionada soulsmakers.com</title>

<%--Creamos la seccion Scripts vamos lo de siempre--%>

//Al documento le añadimos una nueva funcion suscrita al evento keydown, tambien

//esta el Keyup y el key press

document.addEventListener('keydown', function (e) {

//Dependiendo del navegador usara el which o el keycode OJO ES IMPORTANTE

var keycodeentero = event.which || event.keyCode;

//Buscamos el objeto tecla

var objeto = document.getElementById('tecla');

// Y con el String obtenemos la tecla presionada.

objeto.textContent = 'La tecla presionada es: ' + String.fromCharCode(keycodeentero);

})

</script>

</head>

<body>

<asp:Label ID="tecla" runat="server" Text="s"></asp:Label>

</div>

</form>

</body>

</html>

Hasta aqui el ejemplo espero que te sirva

quizas te interese ….FadeIn FadeOut con Jquery aqui

Visita mi canal de youtube para mas ejemplos aqui

Deja un comentario Cancelar respuesta