HTMLpointHTMLpoint HTMLpoint.com


 Eventos que se activan con botones del ratón



En este grupo se pueden incluir los siguientes eventos:

  1. onClick: activado cuando se hace clic en un objeto;
  2. onDblClick: activado con un doble clic;
  3. onMouseDown: activado al pulsar el botón izquierdo del ratón;
  4. onMouseUp: activado cuando deja de pulsarse el botón izquierdo del ratón;
  5. onContextMenu: activado cuando se pulsa el botón derecho del ratón al abrir el ContextMenu.

Los eventos onMouseDown y onMouseUp se activan con dos movimientos del botón derecho del ratón: el primero cuando se pulsa el botón y el segundo cuando se deja de pulsar tras el clic.

El doble clic es un evento que engloba los otros y, para mayor precisión, activa en sucesión onmousedown, onmouseup, onclick.

Ejemplo

Versións y compatibilidad

El uso de estos eventos está limitado por diversos factores. Antes de nada, hay que considerar la versión de Javascript de la que forman parte y, en consecuencia, que no son válidos para todos los navegadores. He aquí el cuadro de la situación (un color diverso del asterisco indica las modificaciones respecto a la versión precedente; NN está por Netscape e IE por Internet Explorer):

Evento

Versión Javascript

NN2.0 NN3.0 NN4.0 NN4.06 IE3.0 IE4.0 IE5.0
onClick 1.0 * * * * * * *
onDblClick 1.2     * *   * *
onMouseDown 1.2     * *   * *
onMouseUp 1.2     * *   * *
onContextMenu DHTML             *

Atención: el evento onDblClick no funciona en Mac.

Valor true y false

El evento onClick con JavaScript 1.1 ha añadido la posibilidad de recibir un valor true o false mediante el cual puede ser activado o no. Esta posibilidad vale también para los eventos onMouseDown y onMouseUp y para onContextMenu.

Ejemplo: haz clic aquí, si respondéis OK, el enlace se activa, si respondéis Anula, el enlace no se activa... He aquí el código:
<A HREF="link.htm" onclick="return(confirm('Estás seguro'))">

La ventaja es que el evento onClick se activa antes de la marca asociada por lo que si es un enlace, éste se carga tras el cumplimiento de la instrucción asociada. Así, esta característica se puede aplicar para no seleccionar las checkbox y para los botones, incluidos Submit y Reset, para considerarlos no pulsados, salvo por un pequeño bug que hace que la opción no funcione para el Reset en algunas plataformas.

Interesante es el efecto onContextMenu, también porque a menudo se solicita que se desactive el botón derecho del ratón, pero funciona sólo con Internet Explorer 5.0.

He aquí un ejemplo válido sólo para Internet Explorer 5.0: Usar el botón derecho en esta imagen y después en ésta

Marcas sensibles

Otro límite es el impuesto a Netscape y las viejas versiones de Explorer por las marcas a las que el evento puede ser asociado:

Evento Marca asociados en Netscape y JScript
onClick Este gestor se usa con los botones de envío (submit), botones de reset (reset), casillas de control (checkbox y radeo), botones, marcas <INPUT> de tipo OPTION y marca <A>.
onDblClick Usado con las marcas <BODY> y <A>
onMouseDown Usado con los botones y las marcas <BODY> y <A>
onMouseUp Usado con los botones y las marcas <BODY> y <A>
onContextMenu Ninguno porque funciona sólo en Explorer 5.0

Mucho más numerosas son las marcas asociadas en Explorer 4.0 y sucesivos a todos los tipos de eventos:

A, ADDRESS, APPLET, AREA, B, BDO, BIG, BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, CITE, CODE, DD, DFN, DIR, DIV, DL, DT, EM, EMBED, FIELDSET, FONT, FORM, HR, I, IMG, INPUT type=button, INPUT type=checkbox, INPUT type=file, INPUT type=image, INPUT type=password, INPUT type=radeo, INPUT type=reset, INPUT type=submit, INPUT type=text, KBD, LABEL, LEGEND, LI, LISTING, MAP, MARQUEE, MENU, NEXTID, NOBR, OBJECT, OL, P, PLAINTEXT, PRE, RT, RUBY, S, SAMP, SELECT, SMALL, SPAN, STRIKE, STRONG, SUB, SUP, TABLE, TBODY, TD, TEXTAREA, TFOOT, TH, THEAD, TR, TT, U, UL, VAR, XMP



  Vuelve a principio de página