Question

前几天我在构建表单时遇到了问题。输入框的类型为“数字”。在Chrome中，输入字段显示向上/向下箭头。当单击向上或向下按钮时，我无法检测到更改，因此我使用CSS删除按钮。这很简单，但它并没有解决我的所有问题。

我在该字段上进行了一些验证（使用keyup）。如果我在字段中输入一个数字它可以正常工作，但如果我在字段中输入一个字母，我就无法检测到它。

使用.val（）在FF和IE中正常工作以获得字段的值（数字或字母），但在Chrome中，并非如此。如果在该字段中有一封信，我也找不到清除该字段的方法。使用.val（''）只需将光标移动到左侧。

正如我所说，此问题特定于使用Chrome。对于所有其他浏览器，我的代码工作正常。

有关可用于解决此问题的代码的任何建议吗？

Answer 1

问题都围绕着输入类型为“数字”的问题。

HTML5草案定义：

值清理算法如下：如果元素的值不是有效的浮点数，则将其设置为空字符串。

http://www.w3.org/TR/html5/forms.html#number-state

尝试执行.val（）来检索其中包含非数字的type = number输入，只返回空字符串。看起来Chrome的实现是在实际检索任何值之前将字段的值设置为空字符串。

至于使用.val（''）重置字段并且无法识别密钥，此代码似乎有效http://jsfiddle.net/hVVSA/2/

JS

var $input = $('input').keyup(function(){
  console.log("here");
});

$('#clearfield').click(function(){
  console.log('val was '+$input.val());
  $input.val('');
});

HTML

<input type="number" />

<button id="clearfield">clear</button>

检测并清除Chrome中的表单字段

1 个答案: