2011-04-10 7 views
5

Necesito detectar de manera confiable el cambio de estado de los botones de opción/casillas de verificación en mi página para ver si el formulario fue modificado o no. Ahora, este es un script completamente separado, no puedo modificar nada que controle el formulario.Detectando un cambio en el botón de opción/estado de casilla de verificación

En este momento, puedo ver solamente dos maneras de hacer esto:

  • onchange controlador de eventos, que ayuda con los cuadros de texto, áreas de texto y selecciona, pero no es despedido por casillas de verificación/radiobuttons manejador
  • onclick evento , que no es confiable, porque los usuarios a menudo usan teclas rápidas para cambiar los valores de estos elementos.

¿Qué es lo que falta aquí? ¿Hay alguna manera de detectar de manera confiable que la casilla de verificación fue marcada/desmarcada?

ACTUALIZACIÓN: Como ustedes señalado, evento de cambio es realmente dispararon en casillas de verificación/botones de radio, a pesar del hecho de que w3schools dice que es sólo para text inputs

Sin embargo, mi problema resultó ser que los valores de casillas de verificación/botones de radio se configuran a través de setAttribute en scripts y en ese caso el evento no se dispara.

¿Hay algo que pueda hacer en este caso?

+1

Las casillas de verificación y los botones de radio disparan el evento 'onchange', el problema es que IE no activará el evento hasta que la casilla de verificación o el botón de radio pierdan el foco. –

Respuesta

1

Ver: http://www.quirksmode.org/dom/events/change.html.

Dice que todos los principales navegadores admiten eventos de cambio pero la implementación del IE tiene errores.

IE activa el evento cuando la casilla de verificación o la radio están borrosas, y no cuando está activada. Este es un error grave que requiere que el usuario realice otra acción y evita una interfaz coherente entre navegadores basada en el evento de cambio en casillas de verificación y radios.

Creo que puede superar el error de IE con este truco. desenfocar() los elementos cuando se encontraron! (Use algo como $('input[type=radio]').focus(function(){$(this).blur();}); en jQuery o use javascript puro)

+0

no dispararía este el evento de desenfoque dos veces? – Alex

+5

El comportamiento de IE no es un error, es según la especificación HTML de W3C. La solución es utilizar el evento click para botones de opción y casillas de verificación, ya que el evento de clic se activa cuando cambian de estado. – RobG

0

Bien, después de algunas excavaciones, esto es lo que descubrí. Tenga en cuenta que esto es aplicable a Firefox y, probablemente, solo a Firefox. Como en este caso estaba lidiando con una aplicación interna, esto fue suficiente para mí.

Así que, básicamente, con el fin de fiable detectar cambios en el estado de casilla/botón de radio en Firefox, que tiene que hacer dos cosas:

  1. Configurar personalizados controladores de eventos de Firefox CheckboxStateChange and RadioStateChange para la casilla de verificación y botón de radio, respectivamente. Estos eventos se dispararán cuando el usuario cambie las entradas o cuando se modifique mediante script, usando setAttribute, sin embargo, estos eventos no se activan, cuando se cambia el estado en el script, usando checked o selected propiedades de estos elementos, esto es por qué necesitamos ...
  2. reloj de los cambios de la propiedad checked usando Object.watch

estándar onchange caso no es bueno, ya que sólo se activa cuando el usuario cambia el valor directamente.

Maldición, esto se rompe ...

Si la gente se interesa, voy a publicar algo de código.

Cuestiones relacionadas