Quels événements un <input type="number" /> déclenche-t-il lorsque sa valeur est modifiée ?

Question

Je me demande si quelqu'un sait quels événements un HTML5 <input type="number" /> se déclenche lorsque l'on clique sur ses flèches haut/bas :

J'utilise déjà un onblur lorsque le curseur quitte le champ de saisie.

Answer 1

change serait l'événement qui est déclenché lorsque la valeur du champ change.

Je pense que l'événement HTML5 input ferait également feu.

Answer 2

J'ai constaté que pour jQuery, le code suivant couvrait la saisie au clavier, les changements de molette de la souris et les clics de bouton dans Chrome, et traitait également la saisie au clavier dans Firefox.

$("input[type=number]").bind('keyup input', function(){
    // handle event
});

Answer 3

J'ai trouvé que onkeyup et onchange a tout couvert dans Chrome 19. Il gère la saisie directe de valeurs, l'appui sur la flèche haut-bas, le clic sur les boutons et le défilement de la molette de la souris.

onchange suffirait dans Chrome, mais les autres navigateurs qui ne rendent le champ que sous forme de zone de texte ont besoin de l'attribut onkeyup qui fonctionne parfaitement pour lire la nouvelle valeur.

Lier le mousewheel séparément a eu moins de succès. L'événement se déclenchait trop tôt - avant que la valeur du champ ne soit mise à jour - et donnait donc toujours la valeur précédente du champ.

Answer 4

Le site onchange se déclenche sur le flou mais le oninput se déclenche lorsque vous tapez. Vous pourriez vouloir mettre une minuterie sur l'événement oninput et lancez votre onchange lorsque l'utilisateur s'est arrêté de taper pendant une seconde ?

Answer 5

Il existe un bug actuel dans Edge empêche le changement ou l'entrée de se déclencher lors de l'utilisation des touches fléchées dans une entrée numérique.