js正则验证邮箱、手机号、年龄

最新推荐文章于 2023-01-04 11:35:28 发布

weixin_30916125

最新推荐文章于 2023-01-04 11:35:28 发布

阅读量324

点赞数

原文链接：http://www.cnblogs.com/jasonwang2y60/p/6067715.html

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        input.err{border-color:red;}
        input.suc{border-color:blue;}
    </style>
    <script>
        window.onload=function(){
            var reg={
                email:/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/,
                tel:/1[3-8]\d{9}/,
                age:/1[8-9]|[2-9]{2}|100/,
                cName:/^[\u4e00-\u9fa5]{2,4}/
            }
            var oF=document.getElementById('F1');
            var aInp=oF.children;
            for(var i=0;i<aInp.length;i++){
                aInp[i].onfocus=function(){
                    this.className='';
                    this.οnblur=function(){
                        if(reg[this.name]){
                            if(!reg[this.name].test(this.value)){
                                this.className='err';
                            }else{
                                this.className='suc';
                            }
                        }
                    };
                };
            }
            function check(){
                for(var i=0;i<aInp.length;i++){
                    if(reg[aInp[i].name]){
                        if(!reg[aInp[i].name].test(aInp[i].value)){
                            return false;
                        }
                    }
                }
                return true;
            }
            oF.onsubmit=function(){
                for(var i=0;i<aInp.length;i++){
                    if(reg[aInp[i].name]){
                        if(!reg[aInp[i].name].test(aInp[i].value)){
                            aInp[i].className='err';
                        }
                    }
                }
                if(!check()){
                    return false;
                }
            };
        };
    </script>
</head>
<body>
<form action="http://www.baidu.com" id="F1">
    email:<input type="text" name="email" id="email">
    tel:<input type="text" name="tel" id="tel">
    age:<input type="text" name="age" id="age">
    cName:<input type="text" name="cName" id="cName">
    <input type="submit" value="提交">
</form>
</body>
</html>

转载于:https://www.cnblogs.com/jasonwang2y60/p/6067715.html

weixin_30916125

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js正则验证邮箱、手机号、年龄

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> input.err{border-color:red;} ...
复制链接

扫一扫