JQuery différence entre changement et cliquez sur événement de la case à cocher

Selon le W3C, l'événement onclick est déclenché par le clavier à des fins d'accessibilité:

SCR35: rendre accessible le clavier des actions en utilisant l'événement onclick des ancrages et des boutons

Afin de fournir une meilleure expérience utilisateur pour ceux qui n'ont pas recours à une souris, les navigateurs ont été développés pour déclencher l'événement onclick même si le clic se produit avec un clavier.

Pour cette raison, l'événement de click de jQuery disparaîtra même si la case à cocher est cliquée en utilisant la barre d'espace du clavier. change , évidemment, déclenche chaque fois que l'état de la case à cocher change.

La case à cocher est le cas spécial où le change et le click sont interchangeables, car vous ne pouvez pas déclencher l'événement de change sans déclencher un click .

Bien sûr, l'exception à cette règle est si vous souhaitez utiliser javascript pour modifier manuellement la case à cocher, par exemple:

 /* 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/

J'espère que cela t'aides.

La principale différence: lorsque vous cliquez / frappez l'espace sur une case à cocher ciblée, d'abord l'événement de click a été déclenché, sans modification. À 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 et de déclencher l'événement de change (qui n'a pas eu d'action par défaut).

Dans certains navigateurs, l'événement de changement ne se déclenche qu'après le premier blur après le click .

Je suppose que le changement se déclenche lorsque la case à cocher change (même si vous ne cliquez pas dessus). Par exemple, si vous modifiez l'état de la case à cocher via une autre fonction.

Vous pouvez cocher ou désactiver la case à cocher sans cliquer, en utilisant le clavier (onglet et barres spatiales), cela va à l'instruction de modification, mais pas à cliquer. A mon humble avis

S'il vous plaît laissez-moi savoir si cela ne m'aide pas, je supprimerai mon message:

Change : http://api.jquery.com/change/ – Je considère que l'événement de changement est déclenché lorsque l' state de l'élément est modifié, c'est-à-dire qu'il n'a pas été cliqué mais modifié. La case à cocher a vérifié et non vérifié.

Click : cliquez sur l'événement lorsque vous cliquez sur l'élément, peu importe l'état de la case à cocher va être.

Comme dans le 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 un clic, l'état n'a pas encore changé, avec le changement, il a …

Modifiez les incendies d'événements lorsque l'état de la case à cocher a été modifié par l'événement qui se produira soit par l'espace de pressage lorsque la case à cocher est concentrée, soit l'événement de changement déclenché, soit cliquez sur l'endroit où l'événement Click a été déclenché uniquement lorsque nous avons cliqué sur la case à cocher par clic de souris, mais à Cette fois avant le clic si l'événement de changement a été spécifié, il s'exécute également puis exécute un événement de clic.

Ici, vous pouvez voir un script clair a été effectué sur les bacs: http://codebins.com/codes/home/4ldqpbu