> Faqs > Cómo detectar que se ha pulsado la tecla ENTER sobre un campo INPUT

Cómo detectar que se ha pulsado la tecla ENTER sobre un campo INPUT

¿Cómo detectar que se ha pulsado la tecla Enter cuando se escribe en un campo input de HTML?

Y luego ¿cómo obtener lo que hay escrito en el campo de texto en el momento en el que se pulsó la tecla Enter?

Respuestas

Para detectar cuando se ha pulsado la tecla Enter en un campo de texto de formulario (tipo input text) necesitas definir un manejador de eventos de tipo keydown con JavaScript.

<!DOCTYPE html>
<html>
<head>
<title>detectar pulsación de Enter</title>
</head>
<body>

<input type="text" id="elInput">

<script>
document.getElementById('elInput').addEventListener('keydown', function(e) {
    if(e.keyCode === 13) {
      // entonces haces lo que quieras para poder reaccionar a la pulsación del enter.
      
      // si necesitas ver qué hay escrito en el campo de input accedes a e.target.value
      console.log(e.target.value);
    }
});
</script>

</body>
</html>

En este código tienes el campo input al que le hemos puesto un identificador.

Luego en el script se accede a ese campo input para poder un manejador de eventos keydown. Este manejador ejecuta el código que necesitas realizar. Para ello recibe el evento como parámetro y verifica si la tecla presionada es Enter (se hace comparando event.keyCode si equivale a 13, que es el código de la tecla Enter)

Si se presiona Enter, entonces se muestra en consola el valor de la propiedad e.target.valueque es justamente lo que hay escrito en el campo de formulario donde se ha puesto en manejador de evento.

Camila
640 27 42 6
Muchas gracias por tu respuesta Camila, funciona perfecto!!!