今天在切图网（qietu.com）一个手机webapp项目中，需要对输入金额的文本框加以判断，这里只能输入数字，输入其他的字符自动清除掉，这个肯定不难，但是如果你没有思路，手上也没有比较实用的代码片段，这个也着实会让你头疼，关于这个问题，一共测试了两种可行方案。

1， keyup的时候，对于文本框的内容进行replace 正则替换，落地代码：

1. /*文本框只能输入文字*/

2. var just_num = function(obj){

3. obj.val(obj.val().replace(/\D|^0/g,''));

4. }

为了方法灵活调用所以写成了函数，调用：

1. //用法

2. $('.test').keyup(function(){

3. just_num($(this));

4. })

但是这种方式，在手机下存在一个bug，就是不能在中间插入数字，（原因也很简单，因为keyup的时候，文本执行了一次替换，所以光标就不在原来位置了）

2，这个方法简单，暴力，高效

思路：如果 keyCode 不是数字，直接 event.preventDefault(); 禁用js原生事件，落地代码：

1. var just_num2 = function(event){

2. // IE

3. if (!$.browser.mozilla) {

5. if (event.keyCode && (event.keyCode < 48 || event.keyCode > 57))

6. event.preventDefault();

7. }

8. //firefox

9. else {

11. if (event.charCode && (event.charCode < 48 || event.charCode > 57))

12. event.preventDefault();

13. }

14. }

为了使用方法，也封装了函数，调用：

1. //拒绝输入数字以外的字符

2. $('input[type=number]').keypress(function(event){

3. just_num2(event);

4. })

webapp是支持 type="number" 写法的，所以配合这个使用，非常有效，代码也标准。

内容切图社区（qietu.cn） 首发，注明来源可转载。

切图微信公众号：qietuwang