jQuery val refuse de renvoyer une entrée non numérique à partir d’un champ numérique (Sous Chrome)

Je suis tombé par hasard sur quelque chose de bizarre dans jQuery, tout en écrivant du code de validation.

Mon script examinera ensuite chaque champ de la page en vérifiant les classes et en le validant au besoin. J’ai remarqué étrangement que si j’entre un “X” dans l’un de mes champs numériques, j’obtiens une erreur “Veuillez entrer une valeur dans ce champ” au lieu d’une erreur “cela devrait être un nombre”. Après quelques critiques et beaucoup de débogage, jongla avec jsFiddle pour montrer ma théorie. Il apparaît que si vous entrez un caractère dans un champ numérique, puis essayez de faire un .val () de jQuery, il ne retournera rien, comme si le le champ était vide (je suis tombé sur cette information dans Chrome – je ne suis pas sûr que cela fonctionne de la même manière dans tous les navigateurs);

http://jsfiddle.net/shawson/SE46L/3/

Voici le violon – entrez quelques chiffres, puis quelques lettres pour vous rendre compte de la folie. Quelqu’un sait si c’est par conception, et si oui … pourquoi?

Ce n’est pas un problème jQuery. Vous obtiendrez le même résultat si vous utilisez l’élément.value natif (par exemple, avec getElementByID (‘quelque chose’). Valeur). C’est bizarre de savoir comment Chrome traite le type d’entrée = nombre et vous pouvez choisir de le contourner en utilisant type = text et la propriété pattern.

Voir cette question plus ancienne pour plus de fond.

Confronté au même problème dans Chrome, ne donnera pas de valeur sur type = nombre quand ils ne sont pas numériques. Le travail que j’ai mis en place consistait simplement à définir la valeur comme telle. De cette façon, il ne vous laissera pas entrer des valeurs non numériques en premier lieu. C’est un hack mais ça marche.

par exemple:

 $('body').find('input[type="number"]').each(function(k,v) { $(this).on('keyup blur', function() { $(this).val($(this).val()); }); });