实现检查用户的注册邮箱是否存在_任务2——检查用户的注册邮箱是否存在-CSDN博客

本文链接：https://blog.csdn.net/qq_42754261/article/details/94464232

在这里插入图片描述

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javaScript" src="../js/jquery.min.js"></script>
<script>

	$(function(){
		$("input[name='email']").blur(verify);
		$("#remind").hide();
		$("#myform").submit(verify);
		
		function verify(){
			$Reg = /^\d+@[a-z A-Z]{2}\.[a-z A-Z]{2,3}$/;
			$email = $("input[name='email']").val();
			if($email == ""){
				$("#email").html("不能为空");
				return false;
			}
			if(!$Reg.test($email)){ 
				$("#email").html("邮箱格式错误");
				return false;
			
			}else{
				$.ajax({
					"url"		:	"<%=request.getContextPath()%>/Verify",
					"type"		:	"get",
					"data"		:	"email="+$email,
					"dataType"	:	"text",
					"success"	:	callBack, //成功时调用的函数
					"beforeSend":	before,//在发起请求前调用的函数
					"complete"	:	complete,
				});
			}
			
		}
		function complete(){
			$("#remind").hide();
			$("#submit").removeAttr("disabled");
		}
		function callBack(data){
			alert(data);
			if(data == "false"){
				$("#email").html("可以注册");
				return false;
			}else{
				$("#email").html("邮箱已经存在");
				return true;
			}
		};
		function before(){
			$("#remind").show();
			$("#submit").attr("disabled","disabled");
		}
	});
	
</script>
<title>使用Post发送请求</title>
</head>
<body>
	<form action="<%=request.getContextPath()%>/Register" method="post" id="myform">
		<table>
			<tr>
				<td>注册邮箱：</td>
				<td><input type="text" name="email"/></td>
				<td><div id="email"></div></td>
			</tr>
			<tr>
				<td>用户名：</td>
				<td><input type="text" name="name"/></td>
			</tr>
			<tr>
				<td>密码：</td>
				<td><input type="text" name="pwd"/></td>
			</tr>
			<tr>
				<td>确认密码：</td>
				<td><input type="text" name="verify"/></td>
			</tr>
			<tr>
				<td><input	type="submit" value="注册" id="submit" /></td>
			</tr>
			<tr><td><p id="remind" >正在提交</p></td></tr>
		</table>
	</form>
</body>
</html>