Los eventos son acciones que ocurren en el navegador cuando el usuario hace algo. Por ejemplo, cuando los usuarios hacen clic con el mouse o escriben algo en el teclado.
Atributos de eventos: en HTML, podemos usar acciones de eventos en el navegador y, con la ayuda de eventos, el usuario responde al sistema. Los atributos de evento se pueden usar con elementos HTML para realizar varias acciones.
Lista de atributos de eventos: la lista completa de atributos de eventos se proporciona a continuación:
1. Atributos de eventos de ventana
- onafterprint : el atributo onafterprint funciona cuando una página ha comenzado a imprimirse o si se ha cerrado el cuadro de diálogo de impresión. Este atributo se usa junto con el atributo onbeforeprint.
- onbeforeprint : el atributo onbeforeprint funciona cuando una página está a punto de imprimirse. El mensaje de alerta se muestra antes de que aparezca el cuadro de diálogo de impresión. El atributo onbeforeprint se utiliza con el atributo onafterprint.
- onbeforeunload : el evento onbeforeunload se ejecuta cuando el documento está a punto de descargarse. Este evento se utiliza para permitir que se muestre un mensaje en un cuadro de diálogo para informar al usuario si desea permanecer o abandonar la página actual.
- onerror : este atributo funciona cuando se produce un error al cargar un archivo externo. El archivo externo puede contener un archivo de documento o un archivo de imagen.
- onhashchange : este atributo funciona cuando ha habido cambios en la parte de anclaje. La parte ancla comienza con el símbolo ‘#’ de la URL actual.
- onload : este atributo funciona cuando se ha cargado un objeto. Este atributo se usa principalmente dentro del elemento <body> para ejecutar un script. También se puede utilizar con otros elementos. Este atributo se utiliza para comprobar el tipo de navegador y la versión del navegador del visitante, y cargar la versión adecuada de la página web en función de la información.
- onmessage: este evento se usa cuando un objeto ha recibido algún mensaje a través de una fuente de eventos.
- onoffline : el atributo de evento onoffline funciona cuando el navegador funciona en modo fuera de línea. Solo es compatible con la etiqueta <body>. Es lo opuesto al atributo de evento en línea.
- ononline : el atributo de evento en línea funciona cuando el navegador comienza a funcionar en modo en línea. Es opuesto al atributo de evento onoffline.
- onpagehide: Este evento ocurre cuando el usuario se baja de la página web. Por ejemplo, cierre la ventana del navegador, haga clic en el enlace, actualice la página, etc.
- onpageshow : este evento ocurre cuando un usuario navega a un sitio web. Este evento es bastante similar al evento onload, pero ocurre después del evento onload. Ocurre cada vez que se carga la página, mientras que el evento onload no ocurre cuando la página se carga desde la memoria caché.
- onresize : el atributo de evento onresize se activa cada vez que se cambia el tamaño de la ventana del navegador.
- onunload : el atributo de evento onunload funciona cuando el documento se está descargando, es decir, ocurre cuando se ha cerrado el navegador. Se usa principalmente cuando el usuario abre un enlace, envía el formulario y cierra la ventana del navegador.
2. Atributos de eventos de formulario
- onblur : este atributo se activa en el momento en que el elemento pierde el foco. Este atributo se usa principalmente en el código de validación del formulario. Este atributo es lo opuesto al atributo onfocus .
- onchange: El atributo de evento onchange funciona cuando el valor del elemento cambia y selecciona el nuevo valor de la Lista.
- oncontextmenu : este atributo funciona cuando el usuario hace clic derecho en un elemento para abrir el menú contextual.
- onfocus : este atributo onfocus funciona cuando el elemento se enfoca. Este atributo de evento se usa principalmente con elementos <input>, <select>, <a>. Este atributo de evento es compatible con todos los elementos HTML excepto <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, y <título> elementos.
- oninput : este atributo funciona cuando obtiene el valor de entrada del usuario. Este atributo se activa principalmente cuando el usuario cambia el valor de los elementos <input> y <textarea>.
- oninvalid : el atributo de evento oninvalid funciona cuando los valores de un campo de entrada no son válidos o están vacíos. El script se ejecuta cuando un usuario hace clic en el botón Enviar. El campo de entrada requerido debe completarse antes de enviarlo.
- onreset: el atributo de evento onreset en HTML se activa cuando se restablece el formulario. Este atributo funciona con la etiqueta <form>.
- onsearch : este atributo onsearch funciona cuando un usuario presiona el botón ENTER o hace clic en el botón x . Este evento funciona con el elemento <input>.
- onselect : el atributo de evento onselect funciona cuando se ha seleccionado algún texto en un elemento. Es la parte del atributo de evento. Es compatible con muchos elementos HTML, como <tipo de entrada = «archivo»>, <tipo de entrada = «contraseña»>, <tipo de entrada = «texto»> y <área de texto>.
- onsubmit : el atributo de evento onsubmit en HTML se activa cuando se envía un formulario.
3. Atributos de eventos de teclado
- onkeydown : este atributo de evento onkeydown funciona cuando el usuario presiona cualquier tecla del teclado.
- onkeyup : este atributo de evento onkeyup funciona cuando el usuario suelta la tecla del teclado.
- onkeypress : este atributo se activa cuando un usuario presiona una tecla en el teclado. Este atributo de evento no se puede utilizar para todas las teclas (por ejemplo, ALT, CTRL, SHIFT, ESC) en todos los navegadores.
4. Eventos de ratón
- onclick : el atributo de evento onclick funciona cuando el usuario hace clic en el botón. Cuando se hace clic con el mouse en el elemento, se ejecuta el script.
- onmouseout : el atributo onmouseout funciona cuando el puntero del mouse se mueve fuera del elemento especificado.
- ondblclick : este evento de atributo se produce cuando un usuario hace doble clic con el mouse en el elemento. Es una parte del atributo de evento.
- onmouseover : el atributo de evento onmouseover funciona cuando el puntero del mouse se mueve sobre el elemento especificado.
- onmousedown : este atributo onmousedown se activará cuando se presione un botón del mouse sobre el elemento y el orden de los eventos ocurra relacionado con el evento onmousedown (para el botón izquierdo/del mouse)
- onmouseup : este atributo se activa cuando se suelta un botón del mouse sobre el elemento. El orden de los eventos ocurre en relación con el evento onmouseup.
- onmousemove : el atributo onmousemove funciona cuando el puntero se mueve sobre un elemento.
- onwheel : este atributo funciona cuando la rueda del dispositivo de puntero se desplaza hacia arriba o hacia abajo sobre un elemento. El atributo onwheel también funciona cuando el usuario se desplaza o hace zoom en un elemento con el mouse o el panel táctil.
5. Atributos de evento de arrastre
- ondrag : el atributo de evento ondrag funciona cuando el elemento o la selección de texto se arrastra en HTML. Este evento es muy similar al evento de arrastrar y soltar. Este atributo es nuevo en HTML 5.
- ondragstart : Se usa cuando el usuario quiere arrastrar el texto o elemento. Es simplemente el proceso en el que pulsamos sobre el texto deseado para arrastrarlo y soltarlo en una ubicación diferente.
- ondragend : el atributo de evento ondragend funciona cuando el usuario termina de arrastrar el elemento. La característica de arrastrar y soltar es común en HTML5. Cualquier elemento puede hacerse arrastrable usando el atributo arrastrable de HTML5.
- ondrop : el atributo de evento ondrop se usa para arrastrar un elemento o texto y soltarlo en una ubicación o destino válido para soltar. El arrastrar y soltar es la característica común de HTML 5.
- ondragenter : el atributo de evento ondragenter en HTML funciona cuando el contenido se puede arrastrar. Un elemento se crea estableciendo el valor del atributo arrastrable en verdadero. El atributo arrastrable solo puede tomar un valor verdadero o falso.
- onscroll : este atributo onscroll funciona cuando se desplaza la barra de desplazamiento de un elemento. Para crear una barra de desplazamiento en un elemento, utilice la propiedad de desbordamiento de CSS.
- ondragleave : el atributo ondragleave funciona cuando un elemento que se puede arrastrar o una selección de texto deja un destino de colocación válido. Ayuda a arrastrar los elementos y está entrando o saliendo de un destino de colocación.
- ondragover : este evento ocurre cuando un elemento que se puede arrastrar se arrastra sobre una zona de colocación válida.
6. Atributos de eventos del portapapeles
- oncopy : este atributo se activa cuando el usuario copió el contenido presente en un elemento. El atributo oncopy se usa con elementos <img>, <input>, <p>, etc.
- onpaste : el atributo onpaste funciona cuando algunos contenidos se pegan en un elemento. Este atributo de evento es compatible con todos los elementos HTML. Se usa principalmente con el elemento <input>.
- oncut : este atributo se activa cuando el usuario corta o elimina el contenido que ha estado presente en el elemento. Es un atributo de tipo booleano. Este atributo es compatible con todos los elementos HTML, pero es posible para ese elemento que tiene un atributo ContentEditable establecido en «verdadero».
7. Atributos de eventos de medios
- onabort : esto ocurre en el aborto de una carga de audio/video cuando la descarga de datos multimedia se cancela sin ningún error.
- oncanplay : Ocurre cuando un audio/video específico está lo suficientemente almacenado en el búfer para comenzar.
- oncanplaythrough : se utiliza cuando los medios, es decir, el audio/vídeo, pueden reproducirse hasta el final sin almacenamiento en búfer.
- onemptied: Ocurre cuando el evento está vacío.
- onended : Ocurre cuando se completa el audio/video.
- ondurationchange : Ocurre cuando se cambia la duración del audio/video.
- onerror : se activa cuando se produce una interrupción al cargar un archivo externo.
- onloadeddata : Ocurre cuando los datos del cuadro actual se cargan pero los datos del siguiente cuadro no son suficientes para reproducir el audio/video.
- onloadedmetadata : Ocurre cuando se cargan metadatos para el audio/video especificado.
- onloadstart : Ocurre cuando comienza el proceso de carga de un audio/video específico.
- onpause : Ocurre cuando el audio/video está en pausa. El audio/video puede ser pausado por el usuario o programáticamente.
- onplayevent : Ocurre cuando se reproduce el audio/video. El audio/video puede ser reproducido por el usuario o mediante programación.
- onplaying : Ocurre cuando el audio/video está en pausa y reproduciéndose después del búfer.
- onprogress : Ocurre cuando el navegador está descargando el audio/video especificado.
- onratechange : Ocurre si se cambia la velocidad de reproducción del audio/video. La propiedad playbackRate se usa para establecer o devolver la velocidad de reproducción actual de un audio/video.
8. Atributos de eventos misceláneos
- ontoggle : el evento ontoggle se activa cuando el usuario abre o cierra el elemento <detalles>. El elemento <detalles> se utiliza para proporcionar información/detalles adicionales que el usuario puede ver u ocultar detalles según los requisitos.
Publicación traducida automáticamente
Artículo escrito por GeeksforGeeks-1 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA