HTML: Atributos de eventos

Los atributos de eventos son mecanismos que crean una interacción entre los elementos del documento HTML y ciertos sucesos que pueden estar relacionados con el sistema o con las acciones del usuario.

Estos eventos están asociados a fragmentos de código JavaScript, por lo que se ejecutan en el lado del cliente. Se utilizan para que el código ejecute funciones que se iniciarán según las condiciones propias del evento; por ejemplo, cuando el usuario haga clic sobre un elemento determinado.

Existen algunos atributos de eventos que están disponibles para todos los elementos que existen, mientras que hay otros que sólo tendrán efecto en elementos específicos. Este sería el caso de eventos relacionados con la reproducción de contenido multimedia como audio y vídeo.

Atributos de eventos de ventana

Estos atributos de eventos sólo se aplican al elemento <body>.

Atributo Descripción
onafterprint Se ejecuta cuando el documento es imprimido.
onbeforeprint Se ejecuta antes de que el documento sea imprimido.
onbeforeunload Se ejecuta antes de abandonar la página, justo antes de que se ejecute onunload.
onblur Se ejecuta cuando la ventana pierde el foco.
onerror Se ejecuta cuando ocurre un error durante la descarga de un documento.
onhashchange Se ejecuta cuando cambia el texto ancla de una URL (lo que viene después de #).
onload Se ejecuta cuando se ha cargado completamente el contenido de una página web.
onmessage Se ejecuta cuando se activa un mensaje.
onoffline Se ejecuta cuando el navegador web trabaja sin conexión a Internet.
ononline Se ejecuta cuando el navegador web trabaja con conexión a Internet.
onpagehide Se ejecuta cuando el usuario sale de la página web.
onpageshow Se ejecuta cuando el usuario navega hacia la página web.
onpopstate Se ejecuta cuando el historial de la ventana cambia.
onredo Se ejecuta cuando se usa la opción Rehacer (Redo).
onresize Se ejecuta cuando la ventana cambia de tamaño.
onstorage Se ejecuta cuando se actualiza el almacenamiento web.
onundo Se ejecuta cuando se usa la opción Deshacer (Undo).
onunload Se ejecuta cuando el usuario ha abandonado la página web.

Atributos de eventos de formulario

Algunos eventos pueden ocurrir en un formulario y por tanto son conocidos como eventos de formulario. Estos eventos ocurren cuando un usuario abre o cierra un formulario, cuando se mueve entre formularios, etc.

Los atributos de eventos de formulario pueden ser aplicados a todos los elementos HTML, pero se usan generalmente a los elementos de formulario.

Atributo Descripción
onblur Se ejecuta cuando el elemento de formulario pierde el foco.
onchange Se ejecuta cuando el valor de un elemento ha cambiado.
oncontextmenu Se ejecuta cuando el menú contextual se muestra.
onfocus Se ejecuta cuando un elemento obtiene el foco.
oninput Se ejecuta cuando un elemento obtiene la entrada de datos.
oninvalid Se ejecuta cuando un elemento de entrada tiene un valor inválido.
onreset Se ejecuta cuando se reinicia un formulario.
onsearch Se ejecuta cuando el usuario escribe algo en un campo de búsqueda (<input type='search'>).
onselect Se ejecuta cuando se selecciona texto en un elemento.
onsubmit Se ejecuta cuando se envía el formulario.

Atributos de eventos de teclado

Los atributos de eventos de teclado tienen relación con el uso del teclado y pueden ser aplicados a todos los elementos HTML.

Atributo Descripción
onkeydown Se ejecuta cuando el usuario está pulsando una tecla del teclado.
onkeypress Se ejecuta cuando el usuario ha pulsado una tecla del teclado (no funciona para las teclas Alt, Ctrl, Shift, Esc y PrScr).
onkeyup Se ejecuta cuando el usuario ha dejado de pulsar una tecla.

Atributos de eventos de ratón

Los atributos de eventos de ratón ocurren cuando el ratón interactúa con el documento y pueden ser aplicados a todos los elementos HTML.

Atributo Descripción
onclick Se ejecuta cuando se hace clic sobre el elemento con un botón del ratón.
ondblclick Se ejecuta cuando se hace doble clic sobre el elemento con un botón del ratón.
ondrag Se ejecuta cuando un elemento está siendo arrastrado.
ondragend Se ejecuta cuando el usuario ha terminado de arrastrar un elemento.
ondragenter Se ejecuta cuando un elemento arrastrado se mueve dentro de un destino de colocación válido.
ondragleave Se ejecuta cuando un elemento arrastrado se mueve fuera de un destino de colocación válido.
ondragover Se ejecuta cuando un elemento está siendo arrastrado sobre un destino de colocación válido.
ondragstart Se ejecuta cuando el usuario empieza a arrastrar un elemento.
ondrop Se ejecuta cuando el usuario suelta el elemento que estaba arrastrando.
onmousedown Se ejecuta cuando el botón del ratón está pulsado.
onmousemove Se ejecuta cuando el puntero del ratón se mueve sobre el elemento.
onmouseout Se ejecuta cuando el puntero del ratón se mueve fuera de un elemento.
onmouseover Se ejecuta cuando el puntero del ratón se mueve sobre un elemento.
onmouseup Se ejecuta cuando el botón del ratón deja de estar pulsado.
onscroll Se ejecuta cuando se mueve la barra de desplazamiento de un elemento.
onwheel Se ejecuta cuando el usuario hace girar la rueda del ratón.

Atributos de eventos del portapapeles

Los atributos de eventos del portapapeles tienen que ver con el uso que hace el usuario del portapepeles del sistema operativo.

Atributo Descripción
oncopy Se ejecuta cuando el contenido de un elemento ha sido copiado.
oncut Se ejecuta cuando el contenido de un elemento ha sido cortado.
onpaste Se ejecuta cuando el contenido de un elemento ha sido pegado.

Atributos de eventos para archivos multimedia

Los atributos de eventos para archivos multimedia se pueden usar en cualquier elemento HTML, pero en general se usan en elementos de contenido multimedia, como <video>, <audio>, <img>, <embed> y <object>.

Atributo Descripción
onabort Se ejecuta cuando se detiene la carga de audio o vídeo.
oncanplay Se ejecuta cuando el archivo está preparado para empezar la reproducción.
oncanplaythrough Se ejecuta cuando el archivo está preparado para reproducirse de principio a fin sin interrupciones.
oncuechange Se ejecuta cuando cambia la duración del contenido multimedia.
onemptied Se ejecuta cuando ocurre algo y el archivo pasa a no estar disponible (normalmente un corte de conexión de Internet).
onended Se ejecuta cuando un archivo multimedia ha alcanzado el final.
onerror Se ejecuta cuando ocurre un error mientras el archivo está siendo reproducido.
onloadeddata Se ejecuta cuando los datos del contenido multimedia se han cargado.
onloadedmetadata Se ejecuta cuando los metadatos del contenido multimedia se han cargado.
onloadstart Se ejecuta cuando el navegador web empieza la descarga de los datos del archivo.
onpause Se ejecuta cuando la reproducción del contenido multimedia ha sido pausada.
onplay Se ejecuta cuando el archivo ha iniciado la reproducción.
onplaying Se ejecuta cuando el archivo está preparado para iniciar la reproducción.
onprogress Se ejecuta cuando el navegador web está en proceso de obtener los datos del contenido multimedia.
onratechange Se ejecuta cada vez que cambia el modo de reproducción (avance rápido, reproducción lenta, etc).
onseeked Se ejecuta cuando el usuario ha terminado de saltar a una nueva posición en el contenido multimedia.
onseeking Se ejecuta cuando el usuario empieza a saltar a una nueva posición en el contenido multimedia.
onstalled Se ejecuta cuando el navegador web no puede obtener los datos del contenido multimedia por alguna razón.
onsuspend Se ejecuta cuando el navegador web ya ha empezado a extraer datos del contenido multimedia, pero el proceso fue suspendido antes de que todos los datos fueran completamente cargados.
ontimeupdate Se ejecuta cuando la posición de reproducción ha cambiado.
onvolumechange Se ejecuta cada vez que se cambia el volumen del fichero de audio o vídeo.
onwaiting Se ejecuta cuando el fichero multimedia se detiene temporalmente debido a que necesita cargar el siguiente fotograma.
← Artículo anterior
Artículo siguiente →