input 框自动检测输入是否为数字

最近做一个公众号，我这个菜鸡不得不学习很多东西，谁让老师要我一个人做这个项目呢？

好，进入正题，因为菜，所以很菜，但是百度很厉害啊，谁让我不好意思问老师，而且我也觉得问这么小的问题，太难以启齿。。

因为页面中要输入至少一次的手机号码，所以，输入的东西必须为数字，不能有其他字符（汉字，特殊字符，字母。。。），所以菜鸡我尝试了很久，

然后总结了下我的成果。

代码：

<input type="tel"  maxlength="11" id="delivery-tel" placeholder="手机号">

1.需要点击才可以生效，删除不为数字的内容，留下数字，感觉很麻烦

onclick="if (isNaN(value)) execCommand('undo')"
2.不是数字根本输不进去好吗

onkeyup="this.value=this.value.replace(/[^\d]/g,'') "
3.当表单提交的时候才反应，清掉不为数字的内容，当然也很麻烦

var deliveryTel = $.trim($('#delivery-tel').val());

var pattern = /^[0-9]+(.[0-9]{0,3})?$/;

if (!pattern.test(deliveryTel)) {

dialog.toast('请输入数字', 'none', 1000);

$('#delivery-tel').val('');

$('#delivery-tel').focus();
   return;
                }

根据使用体验，觉得第二种方法为首选，毕竟很方便

当然也可以直接写一个内置的数字键盘，当然菜鸡太菜，还在努力学习。