Manipuladores de eventos de JavaScript
En JavaScript, un evento es una acción que ocurre en una página web dentro del navegador. Esta acción puede estar escribiendo en un campo, hacer clic en un botón o cargar una página. Las acciones pueden ser iniciadas por el navegador o el usuario; Cuando se produce una acción en una página web, el navegador notifica al sistema que ha ocurrido un evento. Los desarrolladores pueden responder a estos eventos escribiendo funciones que se conocen como manejadores de eventos.Los controladores de eventos son funciones que escuchan un tipo específico de evento y cuando ocurre ese evento ejecutan un bloque de código.
¿Qué es el manejo de eventos?
Se activa un evento cada vez que un usuario interactúa con una página web. Este evento puede ser cualquier cosa, desde un usuario haciendo clic en algún lugar de la página hasta cargar una página web.
Cada vez que ocurre un evento en una página web, el navegador notifica el sistema; Funciones específicas del controlador de eventos Escuche sus respectivos eventos y cuando se activan esos eventos, ejecutan el bloque de código escrito dentro de ellos. El código escrito dentro de la función contiene todas las acciones que deben realizarse en respuesta al evento que se está disparando.
En esta publicación, tendremos una discusión detallada sobre diferentes tipos de eventos en JavaScript y cómo manejar estos eventos.
Nota: Usaré la consola para demostrar los ejemplos presentes en esta publicación.
¿Cuáles son los diferentes tipos de eventos??
Algunos de los eventos más comunes que ocurren en JavaScript son:
Eventos de ratón:
- al hacer clic
- ratón hacia abajo
- ratón
- movimiento del ratón
Eventos de teclado:
- llave
- tecla Arriba
Formulario de eventos:
- enfocado
- en la falta de definición
Eventos de ventana:
- encendido
- onderror
La lista de todos los eventos que ocurren en JavaScript es enorme; Solo discutiremos los eventos más comunes y ampliamente utilizados.
Cómo usar el evento de clic en JavaScript
El al hacer clic() El controlador de eventos se utiliza para escuchar los eventos de clic en una página web. Siempre que el usuario haga clic en un elemento HTML en una página web, es respectivo al hacer clic() Se activa el controlador de eventos.
Ahora veamos un ejemplo para tener una comprensión clara del controlador de eventos de clic:
Tenemos una página web con dos botones I.mi. Botón 1 y botón 2:
Si hacemos clic en cualquiera de estos botones, sus respectivos al hacer clic() Se activa el controlador de eventos que imprime un mensaje en la consola.
Cómo usar el evento Focus en JavaScript
El enfocado() El evento se activa cuando un elemento obtiene o pierde el enfoque:
Por ejemplo, en el fragmento de código que se da a continuación, el "FocuseVent ()" se llama método en el enfocado() evento en el aporte etiqueta:
Html
Escriba algo aquí
Javascript
functOfocUsEvent ()documento.getElementById ("input1").estilo.fondo = "verde";
Cómo usar el evento Keydown en JavaScript
El onKeydown () El evento se activa cuando el usuario presiona una tecla:
Por ejemplo, en el siguiente código, el "KeydownEvent ()" se llama a la función en el "OnKeydown" evento, y el mensaje de alerta se muestra en la definición de función:
Html
Escriba algo aquí
Javascript
función keydownEvent ()documento.getElementById ("input1");
alerta ("presionó una tecla");
Cómo usar el evento de carga en JavaScript
El Onload () El evento se activa justo después de que la página web se haya cargado correctamente.
Por ejemplo, en el fragmento de código que se da a continuación, se muestra un mensaje de alerta simple en el Onload () evento en el cuerpo etiqueta:
Eventos de JavaScript
Conclusión
Los eventos son muy importantes para hacer que cualquier página web sea interactiva y receptiva. El navegador o el usuario puede iniciar un evento. Cuando un usuario interactúa con los elementos HTML de una página web, se activa un evento. JavaScript nos da una opción para responder a estos desencadenantes utilizando manejadores de eventos. En esta guía práctica, aprendimos a usar los controladores de eventos para responder a los eventos y hacer que las páginas web sean más receptivas.