Quels événements un <input type = "number" /> est-il déclenché lorsque sa valeur est modifiée?
Je me demande simplement si quelqu'un sait quels événements un élément HTML5 <input type="number" /> est déclenché lorsque l'utilisateur clique sur ses flèches haut/bas:
J'utilise déjà une onblur lorsque le focus quitte le champ de saisie.
change serait l'événement qui est déclenché lorsque la valeur du champ change.
Je pense que l'événement HTML5 input serait également déclenché.
J'ai trouvé que, pour jQuery, la saisie au clavier, les modifications de la souris et les clics de bouton dans Chrome étaient couvertes par le code suivant, ainsi que la saisie au clavier dans Firefox.
$("input[type=number]").bind('keyup input', function(){
// handle event
});
J'ai constaté que onkeyup et onchange couvraient tout ce qui se trouvait dans Chrome 19 . Cette opération permet de saisir directement la valeur, d'appuyer sur la flèche vers le bas, de cliquer sur les boutons et de faire défiler la molette.
onchange seul suffirait dans Chrome, mais les autres navigateurs qui affichent uniquement le champ sous forme de zone de texte requièrent la liaison onkeyup, qui fonctionne parfaitement pour lire la nouvelle valeur.
La liaison de l'événement mousewheel séparément a eu moins de succès. L'événement a été déclenché trop tôt - avant la mise à jour de la valeur du champ - et a donc toujours donné la valeur précédente du champ
L'événement onchange se déclenche avec le flou, mais l'événement oninput se déclenche lors de la frappe. Peut-être voudrez-vous mettre une minuterie sur l'événement oninput et déclencher votre événement onchange lorsque l'utilisateur a cessé de taper pendant une seconde?
Il existe un bogue courant dans Edge empêchant les modifications ou les entrées de se déclencher lorsque vous utilisez les touches de direction pour entrer un nombre.