Saltar al contenido principal

Listado de eventos comunes para addEventListener

Eventos de mouse

EventoDescripción
clickCuando el usuario hace clic
dblclickDoble clic
mouseoverCuando el cursor entra en un elemento
mouseoutCuando el cursor sale del elemento
mousemoveCuando el cursor se mueve sobre un elemento
mousedownCuando se presiona un botón del mouse
mouseupCuando se suelta un botón del mouse
contextmenuClic derecho del mouse

Eventos de teclado

EventoDescripción
keydownCuando se presiona una tecla
keyupCuando se suelta una tecla
keypress(Obsoleto, usar keydown)

Eventos de formularios

EventoDescripción
submitCuando se envía un formulario
changeCuando cambia el valor de un input/select
inputCuando se escribe (mientras se escribe)
focusCuando un input recibe foco
blurCuando un input pierde el foco
resetCuando se resetea un formulario

📄 Eventos del documento o ventana

EventoDescripción
loadCuando la página terminó de cargar
DOMContentLoadedCuando el DOM está listo (antes de imágenes)
resizeCuando la ventana del navegador cambia de tamaño
scrollCuando se hace scroll
beforeunloadAntes de que el usuario cierre o recargue la página
unloadCuando se cierra la página

Eventos de dispositivos (touch/pantalla)

EventoDescripción
touchstartCuando se toca un elemento
touchmoveCuando el dedo se mueve sobre la pantalla
touchendCuando se levanta el dedo
orientationchangeCambio de orientación del dispositivo

Ejemplo básico

const boton = document.getElementById('miBoton');

boton.addEventListener('click', () => {
alert('¡Clic en el botón!');
});