Jsp Ajax之模擬用戶註冊

時間 2021-08-15

標籤 javascript html java web jsp ide 函數 post this 欄目 JSP 简体版

原文原文鏈接

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><base href="<%=basePath%>"><title>My JSP 'regUser.jsp' starting page</title>	<meta http-equiv="pragma" content="no-cache">	<meta http-equiv="cache-control" content="no-cache">	<meta http-equiv="expires" content="0">    	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">	<meta http-equiv="description" content="This is my page">	<script type="text/javascript">		var xhr;		//建立Xhr對象的函數;		function createXhr(){			try{				//普通方式;				return new XMLHttpRequest();			}catch(e){				//異常，則另一種方式;				return new ActiveXObject("Microsoft.XMLHTTP");			}		}		//用戶名，文本框失去焦點處理函數;		function checkUser(){			xhr=createXhr();			//獲得文本框中輸入的內容；			var username=document.getElementById("username").value;			//設置回調函數;			xhr.onreadystatechange=callback;			//alert(username);			//設置請求方式和url，由於是get方式，請求數據直接在url的後面;			xhr.open("get","checkUserAction?username="+username);			//發送請求;			xhr.send(null);		}		function callback(){			//判斷請求完成，而且成功返回;			if(xhr.readyState==4&&xhr.status==200){				var msg=document.getElementById("msg");				var res=xhr.responseText;				//alert(res);				//根據響應返回的數據，進行頁面更新;				if(res=="true"){					msg.innerHTML='用戶名已經存在';				}else{					msg.innerHTML='用戶名能夠註冊';				}			}		}	</script></head><body>	<form action="regAction" method="post"> 		帳戶：<input type='text' id='username' name='username' οnblur='checkUser()'/><span id='msg'></span><br/>		密碼:<input type='password' name='userpwd'><br/>		郵箱：<input type='text' name='email'><br/>		地址:<input type='text' name='address'><br/>		<input type='submit' value='註冊'/>	</form></body></html>

響應的Servlet代碼:javascript

package web;import java.io.IOException;import java.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;public class CheckUserServlet extends HttpServlet {	@Override	protected void doGet(HttpServletRequest req, HttpServletResponse resp)			throws ServletException, IOException {		resp.setContentType("text/html;charset=utf-8");		PrintWriter out=resp.getWriter();		//獲取提交數據;		String username=req.getParameter("username");				if("admin".equals(username)){			out.print("true");		}else{			out.print("false");		}		out.close();	}	@Override	protected void doPost(HttpServletRequest req, HttpServletResponse resp)			throws ServletException, IOException {		this.doGet(req, resp);	}}