html5 input[number]类型输入非数字字符val()为“”和解决方案

标签：感知   ring   value   put   input框   字符   其他   内容   document   

html5新增的number输入类型会在input框获得焦点的时候呼起数字键盘，增加了体验的效果。但是在一些安卓机器上，还是能够切换道字符输入，用户也会不小心输入“+”“—”之类的非数字字符。测试了一下，number类型是会自动忽略字母字符和其他非数字字符的，除了“+”“—”“.”这两个字符可以输入,因为这两个是正负数和小数点的符号。

number类型还有一个很坑的点是，如果输入框中的内容不是纯数字（正数，负数都行），内容中包含一些字符的时候，对应dom元素的value就是空（""）。

因此无论是原生的document.getElementById("txt").value还是jq的$(‘selector‘).val()得到的都是空。

这个问题很难解决，即使是keyup和keypress监听输入框也会遇见。

我做的需求是要求不能够输入小数，即是不能输入数字以外的字符。输入以后就把字符删除。

我的做法是用正则表达式检测出输入了字符，把最后一个字符去掉。用keyup监听。

keyup/keypress监听在输入小数点或者+—符的当下是感知不到的，即是dom的value没有改变。在符号后再输入数字字符时才能通过value得知。

$("#moneyInput").on("keyup", function(e) {
var obj = $("#moneyInput"),
value = obj.val();
if (!(/(^\+?[1-9][0-9]*$)/.test(value))) {
value = value.substring(0,value.length-1);
// obj.val("");
obj.val(value);
}
});

html5 input[number]类型输入非数字字符val()为“”和解决方案

标签：感知   ring   value   put   input框   字符   其他   内容   document   

原文地址：http://www.cnblogs.com/mlFronter/p/6690864.html