Récupération de l'entrée brute de l'entrée de nombre html5

Dans html5, l'élément permet à l'utilisateur de saisir des valeurs numériques. Cependant, si l'entrée n'est pas valide (par exemple, contient des caractères non numériques), sa propriété de valeur renvoie une chaîne vide.

le problème:

Comment pouvons-nous récuporer la entrée brute à partir d'un champ, y compris le texte invalide?

Solution:

Bien que les spécifications empêchent la récupération de valeurs non valides, il n'y a aucun moyen de déterminer si l'entrée est vide ou contient du texte non valide. Par conséquent, une approche différente est requise. document.getElementById («Edquantity»); NumberInput.AddeventListener ('Input', (Event) => { const rawvalue = event.target.value; if (isnan (rawvalue)) { // l'entrée est un texte non valide; colorer le rouge NumberInput.classList.add ('Error'); } autre { // l'entrée est un nombre valide; Colorez-le vert NumberInput.classList.Remove ('Error'); } });

Ce script attache un écouteur d'événements à l'élément qui capture la valeur d'entrée chaque fois qu'elle change. Il vérifie ensuite si la valeur est un nombre valide; Si ce n'est pas le cas, il colore l'entrée en rouge; Sinon, il le colore vert.