完善昨天的代码,用异步对象发送异步请求检查账号密码是否存在。正确就用表单submit()跳转,否则弹出提示框
登录界面
<%@ 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 charset="utf-8"> <title>家庭记账本</title> <style type="text/css">/*设置CSS样式*/ input[type=text]{ color: #0099FF; width: 200px; height: 20px; } input[type=password]{ color: #0099FF; width: 200px; height: 20px; } div{ background-color:white; width: 300px; top:100px; left: 200px; } </style> </head> <script>/*给标签绑定函数验证表单*/ window.onload=function(){ var name=document.getElementById("name") var password=document.getElementById("pass") var setbtn=document.getElementById("setbtn") var loginbtn=document.getElementById("loginbtn") var form=document.getElementById("loginform") setbtn.onclick=function(){ form.action="setuser.jsp" form.submit() } loginbtn.onclick=function(){ if(name.value==""){ alert("请输入账号") } else{ createRequest("Aservlet?method=login&name="+name.value+"&password="+password.value) } } } function createRequest(url){ http_request=new XMLHttpRequest(); http_request.onreadystatechange=function(){ if(http_request.readyState==4){ if(http_request.status==200){ alert(http_request.responseText) if(http_request.responseText){ window.location.href="login.jsp" }else{ alert("账号或密码错误!") } } } } http_request.open('GET',url,true); http_request.send(null) } </script> <body> <div id="div1"> <h2 align="center"><font size="5" color="skyblue">家庭记账本账号注册系统</font></h2> <form method="post" id="loginform"> <center>账号<input type="text" id="name" name="name" align="right"/><span id="YN"></span><br><br> 密码<input type="password" id="pass" align="center"/><span id="YP"></span><br> <input type="button" id="loginbtn" value="登录" align="center" /> <input type="button" id="setbtn" value="注册" align="center"/> </center> </form> </div> </body> </html>
后台servlet:
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub request.setCharacterEncoding("utf-8"); response.setContentType("text/html;charset=utf-8"); String method=request.getParameter("method"); dao p=new dao(); if(method.equals("login")) { String name=request.getParameter("name"); String password=request.getParameter("password"); PrintWriter out=response.getWriter(); try { out.println(p.check(name, password)); } catch (SQLException e) { e.printStackTrace(); } } // response.getWriter().append("Served at: ").append(request.getContextPath()); }