HTML5 - 解决数值输入框可以输入字母E的问题（input type="number" ）
作者：hangge | 2018-11-01 08:10
1，问题描述
（1）如果页面需要输入常规数值时，我们通常会使用 number 类型的控件。这样浏览器会自动忽略非数值字符。就是说只能输入数字进去。
<input type="number"/>
（2）但是我们发现字母 e 仍然是可以输入的，无论大写还是小写（当然除了 e 以外的其它字母确实无法输入）：
2，问题原因
这是由于 e 在数学上代表 2.71828，因此它也是一个数字，所以允许输入。
3，解决办法
（1）如果我们想让 number 控件只能输入 0-9 这样纯数字的话，可以在 onkeypress 属性上增加个判断（只接收 0-9 的按键行为）。
<input type="number" onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"/>
（2）如果不需要右侧的上下小箭头（步进器），只要实现一个 input 数字输入框，做法也是一样的。
<input onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"/>
全部评论（0）