w3schools tag tab page change javascript jquery checkbox onchange

javascript - tag - jQuery diferencia entre cambio y clic evento de casilla de verificación



title of page html (7)

Como el título sugiere, quiero saber la diferencia entre el change y el evento de click de la casilla de verificación (en jQuery)

He leído la respuesta a esto ¿Cuál es la diferencia entre .click y .change en una casilla de verificación

Pero, no funciona para mí. change incendios incluso cuando golpeo espacios sin perder el foco.

Aquí hay una demo de violín

Ambos parecen estar trabajando igual. Me estoy perdiendo de algo ?


Cambie los incendios de evento cuando se ha cambiado el estado de la casilla de verificación a través de presionar el espacio cuando se marcó la casilla de verificación o Evento de cambio desencadenado O haga clic en el evento Donde como clic se activó solo cuando hicimos clic en la casilla de verificación con un clic del mouse pero en ese tiempo antes de hacer clic si se ha especificado el evento de cambio, entonces también se ejecuta y luego se ejecuta el evento de clic.

Aquí puede ver que se ha realizado una secuencia de comandos clara en los contenedores: http://codebins.com/codes/home/4ldqpbu


La diferencia principal: cuando hace clic / golpea el espacio en una casilla de verificación enfocada primero se activa el evento de click , sin cambios. En este punto, aún puede evitar la acción predeterminada (con event.preventDefault() ), que sería alternar el estado checked de esa casilla de verificación y disparar el evento change (que no tiene acción predeterminada).

En algunos navegadores, el evento de cambio se disparará solo después del primer blur después del click .


La diferencia que experimenté es esta:

var $check = $('':checkbox''); $checkbox.checked = true; $checkbox.click( function() { alert(this.checked); // true }).change( function() { alert(this.checked); // false });

Entonces, con un clic, el estado aún no ha cambiado, con el cambio que tiene ...


Por favor, avíseme si esto no ayuda. Eliminaré mi publicación:

Change : http://api.jquery.com/change/ - Creo que el evento de cambio se activa cuando cambia el state del elemento, es decir, no se hace clic pero se cambia. La casilla de verificación ha marcado y desmarcado el estado.

Click clic en: haga clic en evento es cuando haga clic en el elemento no importa cuál será el estado de la casilla de verificación.

como en pseudo código

if checkbox state is checked alert(Hulk is awesome); if checkbox is click every time alert(Ironman is alright);


Según el W3C, el evento onclick es activado por el teclado para fines de accesibilidad:

SCR35: hacer que las acciones sean accesibles mediante el uso del evento onclick de anclajes y botones

Con el fin de proporcionar una mejor experiencia de usuario para aquellos sin el uso de un mouse, los navegadores se han desarrollado para onclick evento onclick , incluso si el clic se produce con un teclado.

Por este motivo, el evento de click de jQuery se activará aunque se click la casilla de verificación utilizando la barra espaciadora del teclado. change , obviamente, se activará cada vez que cambie el estado de la casilla.

La casilla de verificación es el caso especial donde el change y el click son intercambiables, porque no se puede disparar el evento de change sin activar también el click .

Por supuesto, la excepción a esta regla es si debe usar javascript para alterar manualmente la casilla de verificación, como por ejemplo:

/* this would check the checkbox without firing either ''change'' or ''click'' */ $(''#someCheckbox'').prop(''checked'',true); /* this would fire ''change'', but not ''click''. Note, however, that this does not change the checkbox, as ''change()'' is only the function that is fired when the checkbox changes, it is not the function that does the changing */ $(''#someCheckbox'').trigger(''change''); /* this would fire ''click'', which by default automatically triggers ''change'' */ $(''#someCheckbox'').trigger(''click'');

Aquí hay una demostración de estas diferentes acciones: http://jsfiddle.net/jackwanders/MPTxk/1/

Espero que esto ayude.


Supongo que el cambio se dispara cuando la casilla de verificación cambia (incluso si no hace clic en ella). Por ejemplo, si cambia el estado de la casilla de verificación a través de alguna otra función.


puede marcar o desmarcar la casilla de verificación sin hacer clic, usando el teclado (pestañas y barras espaciadoras) esto va a cambiar la declaración pero no hacer clic. En mi humilde opinión