jQuery différence entre le changement et le clic événement de la case à cocher
comme le titre suggère que je veux savoir la différence entre le change et click événement de case à cocher (en jQuery)
j'ai lu la réponse à ce Quelle est la différence entre .cliquez et .changement dans la case
mais, ça ne marche pas pour moi. change tire même quand je touche des espaces sans perdre la concentration.
Voici une violon démo
les deux semblent fonctionner de la même façon. Suis-je manqué quelque chose ?
7 réponses
selon le W3C, l'événement onclick est déclenché par le clavier pour des raisons d'accessibilité:
afin de fournir une meilleure expérience utilisateur pour ceux qui n'utilisent pas de souris, les navigateurs ont été développés pour lancer l'événement onclick même si le cliquez se produit avec un clavier.
pour cette raison, l'événement click de jQuery se déclenchera même si la case à cocher est cliqué en utilisant la barre d'espacement du clavier. change , évidemment, va tirer à chaque fois que l'état de la case à cocher change.
il se trouve que la case à cocher est le cas spécial où change et click sont interchangeables, parce que vous ne pouvez pas lancer l'événement change sans déclencher également click .
bien sûr, l'exception à cette règle est si vous deviez utiliser javascript pour modifier manuellement la case à cocher, comme:
/* 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');
voici une démonstration de ces différentes actions: http://jsfiddle.net/jackwanders/MPTxk/1/
Espérons que cette aide.
la différence principale: lorsque vous cliquez / appuyez sur espace sur une case à cocher focalisée d'abord l'événement click tiré, sans changement. À ce stade, vous pouvez toujours empêcher l'action par défaut (avec event.preventDefault() ) qui serait de basculer l'état checked de cette case à cocher, et de lancer l'événement change (qui n'a pas d'action par défaut).
Dans certains navigateurs, le changement événement se déclenche qu'après le premier blur après le click .
je suppose que changer les feux lorsque la case à cocher change (même si vous ne cliquez pas dessus). Par exemple, si vous changez l'état de la case à cocher via une autre fonction.
vous pouvez cocher ou décocher la case sans cliquer, en utilisant le clavier (tabulation et barres d'espace) cela va pour changer la déclaration mais pas pour cliquer. IMHO
s'il vous Plaît laissez-moi savoir si ce n'aide pas, je vais supprimer mon post:
Change : http://api.jquery.com/change / - je pense que l'événement de changement se déclenche lorsque le state de l'élément s'il est changé, c.-à-d. pas cliqué mais changé. Case à cocher a enregistrés et non de l'état.
Click : l'événement de clic est quand vous cliquez l'élément n'a pas d'importance ce que l'état de la case à cocher est va être.
comme en pseudo code
if checkbox state is checked
alert(Hulk is awesome);
if checkbox is click every time
alert(Ironman is alright);
la différence que j'ai vécue est la suivante:
var $check = $(':checkbox');
$checkbox.checked = true;
$checkbox.click( function() {
alert(this.checked); // true
}).change( function() {
alert(this.checked); // false
});
Donc, avec sur l'état n'a pas encore changé, avec le changement...
Changement événement se déclenche quand la case à cocher statut a été modifié par n'importe quel événement va avoir lieu soit par le biais d'appuyer sur la touche espace lorsque la case à cocher a été porté Ou Déclenché événement de changement Ou cliqué Où, comme Sur l'événement a été déclenché uniquement lorsque nous avons cliqué sur la case à cocher par clic de souris, mais à l'époque, avant de cliquer si le changement de l'événement a été spécifié, alors il s'exécute aussi, et puis l'exécuter cliquez sur l'événement.
ici vous pouvez voir le script clair a été fait sur les bacs: http://codebins.com/codes/home/4ldqpbu