js input手机号正则限制11位数字

**  h5开发 js代码限制 input 输入框只能输入纯数字**
(1)方案一

javascript 复制代码
onkeyup = "value=value.replace(/[^\d]/g,'')"

使用 onkeyup 事件有 Bug ,就是在中文输入法状态下,输入汉字之后回车,会直接输入字母

(2)方案二

javascript 复制代码
onchange = "value=value.replace(/[^\d]/g,'')"

使用 onchange 事件,在输入内容后,只有 input 丧失焦点时才会得到结果,并不能在输入时就做出响应

(3)方案三

javascript 复制代码
oninput = "value=value.replace(/[^\d]/g,'')"

使用 oninput 事件,完美的解决了以上两种问题,测试暂时还没有出现其它问题

测试

javascript 复制代码
<input type="text" maxlength="11" oninput = "value=value.replace(/[^\d]/g,'')"  placeholder="请输入您的手机号">

接着加个maxlength="11" 限制只能输入位数为11位;

js验证代码

javascript 复制代码
var num = document.getElementById('num');
                if(num.value.length != 18){
                    alert('输入正确的身份证号码');
                    num.focus();
                    return false;
                }
javascript 复制代码
var phone_reg = /^13[0-9]{1}[0-9]{8}$|15[0-9]{1}[0-9]{8}$|18[0-9]{1}[0-9]{8}|17[0-9]{1}[0-9]{8}$|14[0-9]{1}[0-9]{8}/;
                    var tel_reg = /^([0-9]{3,4}-)?[0-9]{7,8}$/;
                    if(!phone_reg.test(phone.value) && !tel_reg.test(phone.value)){
                        alert('手机或电话号码格式不正确。如果是固定电话,必须形如(xxxx-xxxxxxxx)');
                        phone.focus();
                        return false;
                    }
相关推荐
triumph_passion6 小时前
Tailwind CSS v4 深度指南:目录架构与主题系统
前端·css
UIUV6 小时前
React表单处理:受控组件与非受控组件全面解析
前端·javascript·react.js
henry6 小时前
React Native 横向滚动指示器组件库(淘宝|京东...&旧版|新版)
前端
一只爱吃糖的小羊6 小时前
JSBridge 传参陷阱:h5明明传了参数,安卓却收到为空
前端·javascript
lly2024066 小时前
C# 数据类型
开发语言
实习生小黄6 小时前
window.print 实现简单打印
前端·javascript
Wect6 小时前
LeetCode 26.删除有序数组中的重复项:快慢指针的顺势应用
前端·typescript
同学807966 小时前
H5实现网络信号检测全解析(附源码)
前端·javascript
不想秃头的程序员6 小时前
Vue 与 React 数据体系深度对比
前端·vue.js
前端流一6 小时前
[疑难杂症] 浏览器集成 browser-use 踩坑记录
前端·node.js