js--表单验证 正则

1.注册按钮的cursor的not-allowed属性，内容没填无法提交。

 ckbox.onclick = function () {
            if (this.checked) {
                submitinfo.className = "bgcolor";
                submitinfo.style.cursor = "pointer";
            } else {
                submitinfo.className = "";
            }
        }

2.所有input失去焦点事件

for (var i = 0; i < useritem.length; i++) {
            useritem[i].index = i;
            useritem[i].onblur = function () {
                formlist[this.id].call(this);
            }
        }

3.表单提交事件，error记录input值为空的情况，error.length=0，才能提交

formuser.onsubmit = function () {
            if (ckbox.checked) {
                for (var i = 0; i < useritem.length; i++) {
                    useritem[i].focus();
                }
                submitinfo.focus();
                //input显示error错误的个数
                var errlength = document.getElementsByClassName("error").length;
                if (errlength) {
                    return false;
                }
                return true;
            } else {
                return false;
            }
        }

4.密码明文暗文切换

 eyebtn[0].onclick=function () {
            if(useritem[1].type=="password"){
                this.src="./img/eye.png";
                useritem[1].type="text";
            }else{
                this.src="./img/eye1.png";
                useritem[1].type="password";
            }
        }
        eyebtn[1].onclick=function () {
            if(useritem[2].type=="password"){
                this.src="./img/eye.png";
                useritem[2].type="text";
            }else{
                this.src="./img/eye1.png";
                useritem[2].type="password";
            }
        }

5.写正则匹配
①用户名

userid: function () {
                if (this.value.trim()) {
                    if (this.value.trim().length >= 4 && this.value.trim().length <= 20) {
                        //使用正则表达式去验证
                        if (this.value.trim().match(/^[0-9]{4,20}$/)) {
                            spaninfo[this.index].className = "spaninfo error";
                            spaninfo[this.index].innerHTML = "账号不能是纯数字";
                        }
                        else {
                            spaninfo[this.index].className = "spaninfo success";
                        }
                    }
                    else {
                        spaninfo[this.index].className = "spaninfo error";
                        spaninfo[this.index].innerHTML = "*账号名长度要在4-20位之间";
                    }
                }
                else {
                    spaninfo[this.index].className = "spaninfo error";
                    spaninfo[this.index].innerHTML = "*账号名长度要在4-20位之间";
                }

            }

其余同理。

---

正则表达式exp

咋用？？
1.exp.test(str) 返回true，false
2.str.match(exp) 返回集合或者null

    var exp=/^[0-9]{5}$/; //正则表达式
    var str="23443";
    var str1="123";
1.
    console.log(exp.test(str));//返回true
    console.log(exp.test(str1));//返回false
2.
    console.log(str.match(exp));//返回集合
    console.log(str1.match(exp));//错误，则返回null

符号表一览：

\  转义字符
       ^  代表表达式的开始位置
       $  代表的是结束位置
       *  匹配前面的子表达式0次或多次
       +  匹配前面的子表达式1次或多次
       ？ 匹配前面的子表达式0次或1次
       {} 限定符  限定前面子表达式的次数
       {n} 匹配前面的子表达式n次
       {n,} 匹配前面的子表达式至少n次  或者多次
       {n,m}  至少匹配n次  做多m次   n<=m
       |  或  (z|f)ood   zood  food
       []  集合
       [abc]  匹配的是字符串里面的a  |  b | c
       [^abc] 匹配的是非 a| b|c 的其他字符
       [0-9] [a-z] [A-Z]  匹配的是范围集合
       [^0-9]除过0-9 之外的其他值
       () 括子表达式的
       \b  匹配单词的边界  单词和空格直接的位置
       \B  匹配的是单词非边界  （包含中间和开始）
       g 全局查找
       \d  匹配数字  [0-9]
       \D  匹配非数字  [^0-9]
       \n  换行符
       \r  回车
       \s  匹配空白字符   空格   换行  回车
       \S  匹配非空白字符    除了空格   换行  回车  其他的
       \w  匹配  [0-9a-zA-Z_]
       \W  匹配 [^0-9a-zA-Z_]

一般用法：

//邮箱正则怎么写
    var ereg=/^\w{5,10}\@((qq)|(sina)|(163))\.((com)|(cn)|(xyz))$/;
    var email="[email protected]";
    console.log(email.match(ereg));
    
//电话号码   正则
    var telreg=/^1[34578]{1}\d{9}$/;
    var tel="12212312312";
    console.log(tel.match(telreg));
    
//一般的网址   正则
    //https://www.baidu.com
    var wreg=/^(http|https)\:\/{2}(www)\.[0-9a-zA-Z]+\.com$/;
    var zhi="http://www.baidu.com";
    console.log(zhi.match(wreg));
    
 //身份证   正则
	var sf="610324199801011311";
    var sfz=/^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
    console.log(sf.match(sfz));