javaseday38补充二(表单校验)

来源：互联网发布：淘宝膏药属于哪个类目编辑：程序博客网时间：2024/06/07 20:02
<script type="text/javascript">        /*        function checkUser()        {            var oUserNode = document.getElementsByName("user")[0];            var name = oUserNode.value;            var oSpanNode = document.getElementById("userspan");            //定义正则表达式            var reg = new RegExp("^[a-z]{4}$","i");//必须是4个字母            reg = new RegExp("^[0-9]{4}$")//必须是4个数字 \\d 因为是字符串中所以要转译             reg = /^[0-9]{4}$/;// 没有双引号 不用转译            var flag = true;            if(reg.test(name))            {                oSpanNode.innerHTML="pl";                   flag = true;            }            else            {                oSpanNode.innerHTML="cuowu".fontcolor("red").fontsize("22px");                  flag = false;            }            return flag;        }*/        /*            发现很多框的校验除了几个内容不同外 检验的过程功能是一样的             所以要进行代码的提取        */        function check(name,reg,spanId,okinfo,errinfo)        {            var flag;            var val = document.getElementsByName(name)[0].value;            var oSpanNode = document.getElementById(spanId);            if(reg.test(val))            {                oSpanNode.innerHTML=okinfo;                 flag = true;            }            else            {                oSpanNode.innerHTML=errinfo.fontcolor("red").fontsize("22px");                  flag = false;            }            return flag;        }        //校验用户名        function checkUser()        {            var reg = /^[a-z]{4}$/i;            return check("user",reg,"userspan","用户名正确","用户名错误");            }        //校验密码        function checkPsw()        {            var reg = /^\d{4}$/;            return check("psw",reg,"pswspan","zq","cw");                }        //检验确定密码 只要和密码一致即可        function checkRepsw()        {            var flag;            //获取密码框内容            var pass = document.getElementsByName("psw")[0].value;            //获取确认密码框内容             var repass = document.getElementsByName("repsw")[0].value;             //获取确认密码的span区域            var oSpanNode = document.getElementById("repswspan");            if(pass==repass)            {                oSpanNode.innerHTML="正确";                   flag = true;            }            else            {                oSpanNode.innerHTML="错误".fontcolor("red").fontsize("22px");                 flag = false;            }            return flag;        }        //校验邮件        function checkMail()        {            var reg = /^\w+@\w+(\.\w+)+$/;            return check("mail",reg,"mailspan","zq","cw");          }        //提交事件处理        function checkForm()        {            alert(checkUser()+"--"+checkPsw()+"--"+checkRepsw()+"--"+checkMail())            if(checkUser()&&checkPsw()&&checkRepsw() && checkMail())                return true;            else                return false;           }        function mySubmit()        {            var oFormNode = document.getElementById("userinfo");            oFormNode.submit();         }    </script></head><body>    <!--    表单校验    -->    <form id="userinfo" onsubmit="return checkForm()"><!-- <form id="userinfo" onsubmit="return checkForm()">需要有return -->        用户名称:<input type="text" name="user" onblur="checkUser()" /> <span id="userspan"></span><br />        输入密码 <input type="text" name="psw" onblur="checkPsw()" /><span id="pswspan"></span><br />        确认密码 <input type="text" name="repsw" onblur="checkRepsw()" /><span id="repswspan"></span><br />        邮件地址 <input type="text" name="mail" onblur="checkMail()" /><span id="mailspan"></span><br />        <input type="submit" />    </form>    <!--自定提交按钮 -->    <input type="button" value="我的提交" onclick="mySubmit()" /></body>
阅读全文
0 0