当JS包含非数字字符时,使用JS获取<input type ="number">的值

cap*_*lam 10 javascript html5 textinput

这个jsfiddle演示了以下问题.

最简单的例子是:

<input id="number" type="number" value="1">
console.log(document.getElementById('number').value);
Run Code Online (Sandbox Code Playgroud)

这按预期记录1.但是这样:

<input id="number" type="number" value="1A">
console.log(document.getElementById('number').value);
Run Code Online (Sandbox Code Playgroud)

只记录一个空字符串'',因为值中包含非数字字符.某些设备+浏览器(例如Chrome)允许您在这些输入中输入非数字字符.

这很烦人,因为我想为支持它的设备输入type ="number"(例如iPhone,iPad数字键盘).但是我想使用javascript来阻止输入脏输入 - 这需要在keyup上获取值 - 然后regex替换非数字字符.

看来jQuery的.val()方法给出了相同的结果.

cap*_*lam 4

这就是我一直在寻找的:

$('input[type=number]').keypress(function(e) {
  if (!String.fromCharCode(e.keyCode).match(/[0-9\.]/)) {
    return false;
  }
});
Run Code Online (Sandbox Code Playgroud)

我知道阻止用户输入可能很烦人,但这仍然允许无效输入,例如1.2.3

然而在这种情况下,这正是我所需要的。希望它对其他人有用。感谢@int32_t 的建议。