jQuery | pulsación de tecla()

El método keypress() en jQuery activa el evento keypress cada vez que el navegador registra una entrada de teclado. Por lo tanto, al usar el método keypress() se puede detectar si se presiona o no alguna tecla.
Sintaxis:
para activar el evento de pulsación de tecla para los elementos seleccionados:

$(selector).keypress()

Para adjuntar una función al evento de pulsación de tecla:

$(selector).keypress(function) 

código jQuery para mostrar el funcionamiento del método keypress():

Código #1:
El siguiente código se usa para verificar si se presiona una tecla en cualquier lugar de la página o no.

<html>
<head>
<title>Jquery | Keypress() </title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
</head>
<script>
$(document).keypress(function(event){
      
        alert('You pressed a key');    
});
</script>
<body>
</script>
</body>
</html>

Salida:

Código n.º 2:
para detectar cualquier evento de tecla específico.keyCode y event.que devolverá un valor ASCII de la tecla presionada, ambos son específicos del navegador. El siguiente código se usa para verificar qué tecla se presiona en la página.

<html>
<head>
<title>Jquery | Keypress() </title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
</head>
<script>
$(document).keypress(function(event){
      
    var key = (event.keyCode ? event.keyCode : event.which);
    var ch=String.fromCharCode(key)
        alert('You pressed key : ' +ch);    
      
  
});
</script>
<body>
<br><br>
<center>
<h1>Try pressing any printable character from the keyboard </h1>
</center>
</body>
</html>

Salida:

si se presiona cualquier tecla, la salida será

: Código # 3
El siguiente código se usa para verificar si la tecla Intro se presiona dentro de un cuadro de texto en la página o no.

<html>
<head>
<title>Jquery | Keypress() </title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
</head>
<body>
   
<center> 
        <br><br>
    <h1>Press " Enter key " inside the textbox </h1>
    <input id="textbox" type="text" size="50" />
</center>
<script type="text/javascript">
  
$('#textbox').keypress(function(event){
      
    var keycode = (event.keyCode ? event.keyCode : event.which);
    if(keycode == '13'){
        alert('You pressed  "enter" key in textbox');    
    }
    event.stopPropagation();
});
  
</script>
</body>
</html>

Salida:

cuando se presiona la tecla Intro dentro del cuadro de texto anterior, la salida se vuelve como a continuación :

Nota: El evento de pulsación de tecla no se activa para todas las teclas como los caracteres que no se imprimen (por ejemplo, ALT, CTRL, SHIFT, ESC). El método keydown() se puede usar para verificar estas claves.

Publicación traducida automáticamente

Artículo escrito por ihritik y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *