Ajax 用户验证

最新推荐文章于 2021-08-05 21:58:58 发布

chaoyv

最新推荐文章于 2021-08-05 21:58:58 发布

阅读量195

点赞数

分类专栏： Struts2 文章标签： java javascript web.xml ViewUI

本文链接：https://blog.csdn.net/chaoyv/article/details/84688645

版权

Struts2 专栏收录该内容

50 篇文章 0 订阅

订阅专栏

AjaxUserSer servlet控制器

package servlet;

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;

@SuppressWarnings("serial")
public class AjaxUserSer extends HttpServlet {
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		doPost(request, response);
	}
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		//接收时设置的编码    
		request.setCharacterEncoding("utf-8");    
		//转发时设置的编码    
		response.setCharacterEncoding("utf-8");    
		//以 超文本格式 方式转发    
		response.setContentType("text/html");    
		PrintWriter out = response.getWriter();  

		String username = request.getParameter("username");   
		try {
			Thread.sleep(3000);//线程休眠 3秒
		} catch (InterruptedException e) {
			e.printStackTrace();
		}
		if(username.trim().length()==0||username==null){//为空的判断    
			out.println("<font color='red'>用户名不能为空!</font>");    
		}else if("chaoyi".equals(username)){ //判断这个名字是否存在
			out.println("<font color='red'>用户已存在!</font>");    
		}else{ //不存在则可以使用
			out.println("<font color='blue'>可以使用此用户名!</font>");    
		}   

		out.flush();
		out.close();
	}

}

web.xml 配置

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
	http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
	<display-name></display-name>
	<servlet>
		<servlet-name>ajaxUserSer</servlet-name>
		<servlet-class>servlet.AjaxUserSer</servlet-class>
	</servlet>
	<servlet-mapping>
		<servlet-name>ajaxUserSer</servlet-name>
		<url-pattern>/ajaxUser</url-pattern>
	</servlet-mapping>
	<welcome-file-list>
		<welcome-file>index.jsp</welcome-file>
	</welcome-file-list>
</web-app>

index.jsp 页面

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<html>
<head>
<title>Ajax 用户验证</title>
<script type="text/javascript">
	var xmlHttp;
	function createXMLHttp() {
		if (window.ActiveXObject) {
			//老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
		} else {
			//所有现代浏览器 (IE7+、Firefox、Chrome、Safari 以及 Opera) 都内建了 XMLHttpRequest 对象
			xmlHttp = new XMLHttpRequest();
		}
	}
	function showMag() {
		createXMLHttp(); //建立 XMLHttp 核心对象    
		var url = "ajaxUser?username="
				+ escape(document.getElementById("user").value);
		xmlHttp.open("POST", url);//设置一个请求  
		xmlHttp.onreadystatechange = showMsgCallback;//设置请求完成之后处理的回调函数    
		xmlHttp.send(null);//发送请求，不传递任何参数    
	}
	function showMsgCallback() {
		if (xmlHttp.readyState == 4) {
			if (xmlHttp.status == 200) {
				var text = xmlHttp.responseText;
				document.getElementById("userSpan").innerHTML = xmlHttp.responseText;
			}
		} else {
			document.getElementById("userSpan").innerHTML = "<img src=\"images/loading.gif\" />";
		}
	}
</script>
</head>
<body>
	<h4>用户注册</h4>
	用户名：
	<input type="text" name="user" id="user" οnblur="showMag()">
	<span id="userSpan"></span>
</body>
</html>

效果图：