注册的正则校验要如何实现？

开始想到的是提交表单后servlet正则校验，但是视频似乎是在用户输入的时候就已经能判断符不符合要求了，如何能做到？

爱动脑筋的小伙伴 2019-03-15

源自：监听器 2-5 作业题

收起

3回答

好帮手慕阿满回答被采纳获得+3积分 2019-03-15 15:28:47

同学你好，在老师的演示过程中，在密码和确认密码使用js做了校验，在确认密码中使用失去焦点事件，当失去焦点时调用js函数完成密码和确认密码是否相同。可参考这个问答：https://class.imooc.com/course/qadetail/99055

如果我的回答解决了你的疑惑，请采纳。祝：学习愉快~

收起回答

爱动脑筋的小伙伴提问者 #1

老师我把我这一部分的代码贴上来了，您能帮我看看有没有什么问题吗？

2019-03-15 15:32:17

提问者爱动脑筋的小伙伴 2019-03-15 15:30:35

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	String path=request.getContextPath();
	String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<center>
		<h1>用户注册</h1>
		<form action="<%=basePath %>/RegistServlet" method="post">
			<table width="400px" cellspacing="0px" cellpadding="0px" border="1px">
				<tr>
					<td>用户名</td>
					<td><input type="text" name="username" pattern="\\w{3,12}" required="required" placeholder="用户名为3-12位字母数字或下划线组合"  onblur="checkUsername(this)"></td>
				</tr>
				<tr>
					<td>密&nbsp;码</td>
					<td><input type="password" name="password" pattern="\\d{6,12}" placeholder="密码长度为6-12位的纯数字"  id="password" onblur="checkPassword(this)"></td>
				</tr>
				<tr>
					<td>确认密码</td>
					<td><input type="password" name="checkPWD" pattern="\\d{6,12}" placeholder="密码长度为6-12位的纯数字"  onblur="checkRePassword(this)"></td>
				</tr>
				<tr>
					<td>手机号码</td>
					<td><input type="text" name="phone" pattern="[1][3578]\\d{9}" placeholder="请输入正确的手机号码格式" onblur="checkPhone(this)"></td>
				</tr>
				<tr>
					<td>邮箱</td>
					<td><input type="email" name="email" pattern="[a-zA-Z_0-9]{3,}@([a-zA-Z]+|\\d+)(\\.[a-zA-Z]+)+" placeholder="请输入正确邮箱格式" required="required" onblur="checkEmail(this)"></td>
				</tr>
				<tr>
					<td colspan="2" style="text-align:center">
						<input type="submit" value="注册">
						<input type="reset" value="重置">
					</td>
				</tr>
			</table>
		</form>
	</center>
	<script type="text/javascript">
	 //用户名：  
    var  usernameRegex = /^\w{3,12}$/;  
    //密码：  
    var passwordRegex = /^\d{6,12}$/;  
    //邮箱：  
    var emailRegex = /^[a-zA-Z_0-9]{3,}@([a-zA-Z]+|\\d+)(\\.[a-zA-Z]+)+$/;  
    //手机号码
    var phoneRegex= /^[1][3578]\\d{9}$/;
   
      
    //alert("222");  
    function validateForm(){ //定义validateForm方法用于客户端校验  
        var flag = true;  
        //校验用户名  
        var usernameNode = byName("username"); //获得ID值为username的节点对象  
        var username = usernameNode.value;   //获得usernameNode节点的值，即用户在username文本框内填写的值  
        if(!usernameRegex.test(username)){    //验证获得到的值是否符合正则表达式   
           alert("用户名格式不正确");
        }  
          
        //校验密码  
        var passwordNode = byName("password");  //获得ID值为password的节点对象  
        var password = passwordNode.value;  
        if(!passwordRegex.test(password)){  
           alert("密码格式不正确");
        }  
          
        //确认密码  
        var rePasswordNode = byName("checkPWD");  //获得ID值为rePassword的节点对象  
        var rePassword = rePasswordNode.value;  
        if(!password==rePassword){  
            alert("密码不一致");
        }
          
        //校验邮箱  
        var emailNode = byName("email");  //获得ID值为Email的节点对象  
        var email = emailNode.value;  
        if(!emailRegex.test(email)){  
         	alert("邮箱格式不正确");
                    }  

        
    
          
    function byName(name){  //自定义方法，用于获取传递过来的ID值对应的节点对象  
        return document.getElementByTagName(name);  
    }  
          
    function checkUsername(node){ //当鼠标离开节点时调用此方法，验证节点内容是否符合注册规范  
        //校验用户名  
        var username = node.value;  //得到传递过来的节点对象的值  
        if(!usernameRegex.test(username)){  //验证是否符合节点对应的正则表达式  
        	 alert("用户名格式不正确");
        }
    }  
      
    function checkPassword(node){  //当鼠标离开节点时调用此方法，验证节点内容是否符合注册规范  
        //校验密码  
        var password1 = node.value;  
        //alert("111");  
        if (!passwordRegex.test(password)) {  
        	  alert("密码格式不正确");  
        }  
       
    }     
          
    function checkRePassword(node){  //当鼠标离开节点时调用此方法，验证节点内容是否符合注册规范  
        //确认密码                
        var rePassword = node.value;  
        var password = byName("password").value;  
        //alert(repassword+"***"+password);           
        if(password!=rePassword){                    
        	alert("密码不一致");
        }
    }    
   
    function checkPhone(node){  //当鼠标离开节点时调用此方法，验证节点内容是否符合注册规范  
        //确认密码                
        var phone = node.value;  
        //alert(repassword+"***"+password);           
        if(!phoneRegex.test(phone)){                    
        	alert("电话格式不正确");
        }
    }    
    
    function checkEmail(node){  //当鼠标离开节点时调用此方法，验证节点内容是否符合注册规范  
        //校验邮箱  
        var email = node.value;  
        if(!emailRegex.test(email)){  
        	alert("邮箱格式不正确"); 
        }
    }
    
	</script>
</body>
</html>

找了一个相关的例子改写了一下，没有成功

收起回答