Los eventos

Eventos
Eventos
Vincular
Controladores
Ratón y teclado
Temporizadores
El objeto event
 
Los eventos en funcionamiento
Los eventos son el mecanismo que usa el explorador para llamar y ejecutar las funciones incluidas en una página HTML. Tanto Netscape como Microsoft incluyen este objeto en sus navegadores, si bien lo hacen de manera bastante diferente uno del otro, siendo Internet Explorer el que permite un mayor aprovechamiento y posibilidades de programación. Con DHTML todos los elementos de la página web pueden tener asociado uno o mas eventos. Existe un grupo de eventos que son disparados por las acciones del usuario como mover el ratón, pulsar una tecla, picar una opción del menú, etc. También existe otro grupo de eventos que responden a las acciones del navegador como son el l finalizar de cargar una página, o cuando se va a salir de ella o al terminar de cargar una imagen o cuando se produce un error de ejecución del código. Por último existe un par de eventos bastante imprescindibles para la realización de efectos animados en las páginas, son los eventos temporizados, eventos asociados al reloj del sistema que nos permite ejecutar una determinada acción de manera repetida cada cierto intervalo de tiempo.
A la hora de vincular eventos a los objetos HTML de una página hemos de conocer ciertos principios previos. En primer lugar los elementos de la página disparan los eventos independientemente de que nosotros le asignemos una función manejadora, es decir, cada evento posee un manejador predeterminado, así cuando picamos sobre un enlace el navegador lee el atributo href y nos lleva a la página apuntada por él, algo parecido ocurre con los botones Submit de los formularios. Otras veces ese comportamiento por defecto no hace absolutamente nada. Pero hemos de tener esto en cuenta y si queremos que esa acción predeterminada no se ejecute lo habitual es seguir el manejador del evento con la sentencia return false, o asignar el valor false a la propiedad returnValue del evento, aunque este método sólo vale para IE.
Otra cosa a tener muy en cuenta es la promoción de eventos. Este es un efecto que se observa cuando se produce un evento en un elemento anidado dentro de otro, al producirse un evento en el objeto interno este evento asciende al elemento contenedor hasta llegar al elemento superior de este jerarquía. Por ejemplo:

<p id="Externo" onmouseover="alert(this.id)">
Y aquí el elemento anidado
< span id="interno" onmouseover="alert(this.id)">
< b>elemento interno</b></span>eso está fuera</p>

Y aquí el elemento anidado elemento interno eso está fuera

Esta es un elemento span anidado en un párrafo, si pasamos el ratón sobre el span el evento onmouseover del ratón actúa en primer lugar en el span, mostrando una ventana con su identificador (Interno), pero luego asciende hasta el elemento P provocando la acción vinculada en éste, mostrar una ventana con su identficador (Externo). A veces esto viene bien y otras provoca efectos indeseados. Para cortar esta ascensión del evento se asigna el valor true a la propiedad event.cancelBubble.




     
Envía esta página a un amigo. Te lo agradecerá.   Poner esta página como página de inicio