ssm项目(三)登录验证/注册

登录验证

一:jsp

<table align="center" border="1" cellpadding="10">
	<tr>
		<th colspan="3">登录表格</th>
	</tr>
	<tr>	
		<td>用户名:</td>
		<td><input type="text" name="username" id="username" value="admin"></td>
		<td width="150"><p id="p1"></p></td>
	</tr>
	<tr>	
		<td>密码:</td>
		<td><input type="password" name="passwrod" id="password" value="123456"></td>
		<td><p id="p2"></p></td>
	</tr>
	<tr>	
		<td colspan="3" align="center">
		<input type="submit" value="登录" id="login">
		<a href="registered.jsp">注册用户</a>
		</td>
	</tr>
</table>

二:利用ajax异步提交验证

我们要做的就是,当点击登录的时候,获取username,password的值,来判断是否为空,不为空则提交,让Controller进行提交

$("#login").click(function(){
		var username = $("#username").val();
		var password = $("#password").val();
		if(username==""||username==null){
			$("#username").focus();
			$("#p1").css("color","red");
			$("#p1").html("用户名不能为空");
			return false;
		}else if(password==""||password==null){
			$("#password").focus();
			$("#p2").css("color","red");
			$("#p2").html("密码不能为空");
			return false;
		}else{
			$.ajax({
				url:"login",
				data:{"username":username,
					  "password":password},
				type:"POST",
				dataType:"json",
				success:function(data){
					if(data.ma==1){
						window.location.href="main";
						return true;
					}else{
						alert("用户名或密码错误");
						return false;
					}
				},
				error:function(data){
					alert("我好像出错了"); 
					alert(data.status);
					alert(data.readyState);
					alert(data.responseText);
					return false;
				}
			});
		}
	});

第二个:当username输入框的输入改变的时候,获取数值,查询数据库中是否已经存在

	$("#username").change(function(){
		$.ajax({
			url:"validate",
			data:{"username":$("#username").val()},
			type:"POST",
			dataType:"json",
			success:function(data){
				if(data.ma==1){
					$("#username").focus();
					$("#p1").css("color","red");
					$("#p1").html("*用户名已存在");
				}else{
					$("#p1").html("");
				}
			},
			error:function(data){
				alert(data.status);
				alert(data.readyState);
				alert(data.responseText);
			}
		});
	});

三:注册

主要为图片上传问题

图片上传:https://mp.csdn.net/postedit/82994197

猜你喜欢

转载自blog.csdn.net/qq_40008535/article/details/83042634