前台校验 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <form name="frm" method="post">
            <table>
                <tr><td>用户名：</td><td><input type="text" name="" id="usernameId" value="" /></td><td><span id="userSpanId"></span></td></tr>
                <tr><td>密码：</td><td><input type="password" name="" id="pwdId" value="" /></td><td><span id="pwdSpanId"></span></td></tr>
                <tr><td>确认密码：</td><td><input type="password" name="" id="confPwdId" value="" /></td><td><span id="confPwdSpanId"></span></td></tr>
                <tr><td><input type="button" onclick="check()" value="注册" /></td></tr>
            </table>
        </form>
        
        <script type="text/javascript">
            function check(){
                var result1=checkUserName();
                var result2=checkPwd();
                var result3=checkTwoPwd();
                
                if(result1 && result2 && result3){
                    document.frm.action="RegisterServlet";
                    document.frm.submit();
                }
            }
            
            function checkUserName(){
                var uname=document.getElementById("usernameId");
                var span=document.getElementById("userSpanId");
                if(uname.value.trim().length==0){
                    span.innerHTML="<font color='red'>用户名不能为空啊！</font>";
                    return false;
                }else{
                    span.innerHTML="√";
                    return true;
                }
            }
            
            function checkPwd(){
                var pwd=document.getElementById("pwdId");
                var span=document.getElementById("pwdSpanId");
                if(pwd.value.trim().length==0){
                    span.innerHTML="密码不能为空";
                    return false;
                }else{
                    span.innerHTML="√";
                    return true;
                }
            }
            
            function checkTwoPwd(){
                var pwd=document.getElementById("pwdId");
                var confPwd=document.getElementById("confPwdId");
                
                var pwdspan=document.getElementById("pwdSpanId");
                var confpwdSpan=document.getElementById("confPwdSpanId");
                
                if(pwd.value==confPwd.value){
                    return true;
                }else{
                    confpwdSpan.innerHTML="两次密码不一致";
                    
                    return false;
                }
            }
            
        </script>
    </body>
</html>

 

posted @ 2016-09-22 17:00  IT~天空  阅读(245)  评论(0)    收藏  举报