Tipos de eventos
En este modelo, cada elemento o etiqueta XHTML define su propia lista de posibles eventos que se le pueden asignar. Un mismo tipo de evento (por ejemplo, hacer click con el botón izquierdo del mouse) puede estar definido para varios elementos XHTML diferentes y un mismo elemento XHTML puede tener asociados varios eventos diferentes.
El nombre de cada evento se construye mediante el prefijo
on, seguido del nombre en inglés de la acción asociada al evento. Así, el evento de hacer click en un elemento con el mouse se denomina onclick y el evento asociado a la acción de mover el mouse se denomina onmousemove.
La siguiente tabla resume los eventos más importantes definidos por JavaScript:
| Evento | Descripción | Elementos para los que está definido |
|---|---|---|
onblur | Deseleccionar el elemento | <button>, <input>, <label>, <select>,<textarea>, <body> |
onchange | Deseleccionar un elemento que se ha modificado | <input>, <select>, <textarea> |
onclick | Hacer click y soltar el mouse | Todos los elementos |
ondblclick | Hacer click dos veces seguidas con el mouse | Todos los elementos |
onfocus | Seleccionar un elemento | <button>, <input>, <label>, <select>,<textarea>, <body> |
onkeydown | Pulsar una tecla (sin soltar) | Elementos de formulario y <body> |
onkeypress | Pulsar una tecla | Elementos de formulario y <body> |
onkeyup | Soltar una tecla pulsada | Elementos de formulario y <body> |
onload | La página se ha cargado completamente | <body> |
onmousedown | Pulsar (sin soltar) un botón del mouse | Todos los elementos |
onmousemove | Mover el mouse | Todos los elementos |
onmouseout | El mouse "sale" del elemento (pasa por encima de otro elemento) | Todos los elementos |
onmouseover | El mouse "entra" en el elemento (pasa por encima del elemento) | Todos los elementos |
onmouseup | Soltar el botón que estaba pulsado en el mouse | Todos los elementos |
onreset | Inicializar el formulario (borrar todos sus datos) | <form> |
onresize | Se ha modificado el tamaño de la ventana del navegador | <body> |
onselect | Seleccionar un texto | <input>, <textarea> |
onsubmit | Enviar el formulario | <form> |
onunload | Se abandona la página (por ej: al cerrar el browser) | <body> |
Los eventos más utilizados en las aplicaciones web tradicionales son
onload para esperar a que se cargue la página por completo, los eventos onclick, onmouseover, onmouseout para controlar el mouse y onsubmit para controlar el envío de los formularios.
Algunos eventos de la tabla anterior (
onclick, onkeydown, onkeypress, onreset, onsubmit) permiten evitar la "acción por defecto" de ese evento, que puede resultar muy útil en algunas técnicas de programación.
Las acciones típicas que realiza un usuario en una página web pueden dar lugar a una sucesión de eventos. Al pulsar por ejemplo sobre un botón de tipo
<input type="submit"> se desencadenan los eventos onmousedown, onclick, onmouseup y onsubmit de forma consecutiva.
No hay comentarios.:
Publicar un comentario