jQuery val拒绝从数字字段返回非数字输入（在Chrome下）

刚刚在jQuery中偶然发现了一些奇怪的东西，同时编写了一些validation代码 – 我有一个html5“数字”字段;

然后，我的脚本将查看页面上的每个字段，检查类并根据需要进行validation。 我奇怪地注意到，如果我在我的一个数字字段中输入“X”，我会得到一个“请在此字段中输入一个值”错误，而不是“这应该是一个数字”错误。 经过一些头脑刮擦和大量调试后，我敲了一个jsFiddle来演示我的理论 – 如果你在一个数字字段中输入一个字符，然后尝试从jquery做一个.val（）它会返回任何内容 – 好像是字段是空的（我在Chrome中遇到过这种情况 – 不确定它是否在所有浏览器中都能正常工作）;

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

这是小提琴 – 输入一些数字，然后几个字母来看疯狂。 任何人都知道这是否是设计的，如果是的话……为什么？

Answer 1

这不是jQuery问题。 如果使用native element.value（例如使用getElementByID（’something’）。value），您将得到相同的结果。 这是Chrome如何处理输入类型=数字的怪癖，您可以选择使用type = text和pattern属性来解决它。

有关更多背景，请参阅此旧问题 。

Answer 2

在Chrome中遇到同样的问题，当它们是非数字时，不会给type = number赋值。 我投入的工作是简单地将值设置为自身的值。 这样，它不会让您首先输入非数字值。 这是一个黑客但它的工作原理。

例如：

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