如何去判断一个input输入框中的输入为数字?
问题描述:
这是个自己在公司做项目的时候碰到的问题,起因是产品要求input输入框中只能是数字,要是位数不对,得提示用户,输入了非法的字符,也得提示用户。
解决过程:
本来用的是isNaN,但是总是觉得效果不好,然后就去网上找其他方法,于是想到了正则,但是我一直没法用正则解决。
解决办法:
最终还是回归到isNaN上。先贴出w3c中对于isNaN的描述:
也就是说,它的字面意思就是问你:“括号里的数,它是不是不是一个数字?”,如果返回值为true,也就是它:“不是一个数字”,反之就是:“它是一个数字”
感觉我在说废话,但是对于初学的人有可能就会出错。这个函数真的是简单粗暴,然后为你的input输入框绑定一个oninput事件。
其中,oninput事件和另外一个onchange事件有一点细微的区别,概括来讲就是oninput是即时出结果的,而onchange是秋后算账的,是你的操作完成之后才出结果的,很显然,前者更加适合我们当前场景,我们就相当于使用这个方法监听输入框的输入,而且是即时出结果的,逻辑就写在你的oninput方法里面就行了。
这个oninput事件绑定了之后,你在其内部使用isNaN,只要你输入的一不是数字就能检测出来,比如你输入了一个字母或者其他符号,马上就能有结果,很符合预期的需求。
以下有一些输入的例子:
1. D或其他字母 报错
2. 1 不报错
3. 12. 不报错,应该是自动解析成12.0或者是12了。即将12.也看作是一个正确的数字
4. 12.. 报错,不符合数字的格式,当然报错
5. 00. 不报错 js会将00.解析成0.(我的猜测)
6. 0.. 报错
本博文只是为了帮助一些初学者,或者是遇到相关方面的问题但是找不到好的解决办法的人,大佬请绕道
标签:
相关文章
-
无相关信息