Quelle est la différence entre l'attribut onBlur et onChange en HTML?

Quand l'un est-il appelé par rapport à l'autre? Existe-t-il une situation où onChange serait appelé mais onBlur ne serait pas appelé?

L' onBlurévénement est déclenché lorsque vous vous êtes éloigné d'un objet sans nécessairement avoir changé sa valeur.

L' onChangeévénement n'est appelé que lorsque vous avez modifié la valeur du champ et qu'il perd le focus.

Vous voudrez peut-être jeter un coup d'œil à l'intro de quirksmode aux événements . C'est un excellent endroit pour obtenir des informations sur ce qui se passe dans votre navigateur lorsque vous interagissez avec lui. Son livre est bon aussi.

onblur se déclenche lorsqu'un champ perd le focus, tandis que onchange se déclenche lorsque la valeur de ce champ change. Cependant, ces événements ne se produiront pas toujours dans le même ordre.

Dans Firefox, la tabulation à partir d'un champ modifié se déclenchera lors du changement puis du flou, et cela fera normalement la même chose dans IE. Cependant, si vous appuyez sur la touche Entrée au lieu de l'onglet, dans Firefox, il se déclenchera en mode flou puis en mode de modification, tandis qu'IE se déclenchera généralement dans l'ordre d'origine. Cependant, j'ai vu des cas où IE déclenche également le flou en premier, alors soyez prudent. Vous ne pouvez pas supposer que le onblur ou le onchange se produira avant l'autre.

Un exemple pour rendre les choses concrètes. Si vous avez une sélection ainsi:

<select onchange="" onblur="">
  <option>....
</select>

le onblur()est appelé lorsque vous vous éloignez. Le onchange()est appelé lorsque vous sélectionnez une option différente de la sélection - c'est-à-dire que vous modifiez ce qu'il est actuellement sélectionné.

Dans Firefox, onchange se déclenche uniquement lorsque vous tabulez ou cliquez en dehors du champ de saisie. Il en va de même pour Onblur. La différence est que onblur se déclenchera, que vous ayez changé quoi que ce soit sur le terrain ou non. Il est possible que ENTRÉE déclenche un ou les deux, mais vous ne le sauriez pas si vous désactivez ENTRÉE dans vos formulaires pour éviter les soumissions inattendues.

onBlur, c'est lorsque votre focus n'est plus sur le champ en question.

La propriété onblur renvoie le code du gestionnaire d'événements onBlur, le cas échéant, qui existe sur l'élément actuel.

onChange est lorsque la valeur du champ change.

Je pense qu'il est important de noter ici que onBlur () se déclenche malgré tout.

C'est un fil de discussion utile mais la seule chose qu'il ne clarifie pas est que onBlur () se déclenchera à chaque fois.

onChange () ne se déclenchera que lorsque la valeur est modifiée.

onChange est quand quelque chose dans un champ change, par exemple, vous écrivez quelque chose dans une entrée de texte.

onBlur est lorsque vous retirez le focus d'un champ, par exemple, vous écriviez dans une entrée de texte et vous avez cliqué dessus.

Donc, en réalité, c'est presque la même chose, mais pour que onChange se comporte comme onBlur fait quelque chose dans cette entrée, il faut changer.