Ajax,检查用户名是否存在
Ajax作用:
Asynchronous JavaScript and XML(异步JavaScript和XML)
异步的主要是刷新一个层
Ajax里的onreadystatechange是做什么用的
发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态,XMLHttpRequest对象提供了onreadyStateChange事件实现这一功能。这类似于回调函数的做法。 onreadyStateChange事件可指定一个事件处理函数来处理XMLHttpRequest对象的执行结果,
onreadyStateChange事件是在readyState属性发生改变时触发的,readyState的值表示了当前请求的状态,在事件处理程 序中可以根据这个值来进行不同的处理。 readyState有五种可取值0:尚未初始化,1:正在加载,2:加载完毕,3:正在处理;4:处理完毕。一旦readyState属性的值变成了 4,就可以从服务器返回的响应数据进行访问了。 通常在事件中判断readyState的值是在请求完毕时才做处理,
Http状态码 含义 200 请求成功 202 请求被接受但处理未完成 400 错误请求 404 请求资源未找到 500 内部服务器错误
![](http://www.daimami.com/img/2014/01/01/120131943.jpg)
source code:
1.addTeam.jsp
<%@ page language="java" contentType="text/html; charset=gbk" pageEncoding="gbk"%> <% String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath() + "/"; %> <%@ taglib prefix ="s" uri="/struts-tags"%> <html> <head> <base href="<%=basePath%>"> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <title>增加小组</title> <link rel="stylesheet" type="text/css" href="./css/team.css" /> <script type="text/javascript" src="./js/trim.js"></script> <script type="text/javascript"> var xmlHttp; function createXMLHttpRequest() { if(window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else if(window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } } function startRequest() { //创建请求对象 createXMLHttpRequest(); //为事件readystatechange绑定函数handleStateChange xmlHttp.onreadystatechange = handleStateChange; //打开访问的地址 xmlHttp.open("Post","team/TeamNameCheck",true); xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //发送请求 xmlHttp.send("team.name=" + teamForm.elements["team.name"].value); } function handleStateChange() { if(xmlHttp.readyState == 4) { if(xmlHttp.status == 200) { document.getElementById("namecheck").innerHTML = xmlHttp.responseText; } } } function checkTeam() { if(trim(teamForm.elements["team.name"].value) == "") { alert("请填写组名!"); return false; } if(trim(teamForm.elements["team.leader"].value) == "") { alert("请填写组长!"); return false; } if(trim(teamForm.elements["team.slogan"].value) == "") { alert("请填写口号!"); return false; } return true; } </script> </head> <body> <div id="top"> <h1>增加小组</h1> </div> <div id="content"> <form name="teamForm" action="team/AddTeam" method="post" onsubmit="return checkTeam();"> <p>组名:<input type="text" name="team.name" onblur="startRequest()"><span id="namecheck"></span> <p>组长:<input type="text" name="team.leader"> <p>口号:<input type="text" name="team.slogan"> <p><input type="submit" value="确定"> <input type="reset" value="重填"> </form> <p><s:fielderror></s:fielderror></p> <p><a href="./team/index.jsp">返回小组管理</a> </div> </body> </html>
2.struts.xml文件里面配置解决中文乱码:
<constant name="struts.i18n.encoding" value="UTF-8"></constant>
假如是“UTF-8”以外的其他编码如gbk,都会在action里面接收的name都是乱码,因为var xmlHttp;对象默认提交的编码就是utf-8
3.struts.xml配置文件(没有result):
<actionname="TeamNameCheck" class="com.org.momo.action.team.TeamNameCheckAction"> </action> TeamNameCheckAction.java package com.org.momo.action.team; import java.io.IOException; import java.io.PrintWriter; import java.util.List; import javax.annotation.Resource; import javax.servlet.http.HttpServletResponse; import org.apache.struts2.ServletActionContext; import com.opensymphony.xwork2.ActionSupport; import com.org.momo.bean.Team; import com.org.momo.service.TeamService; public class TeamNameCheckAction extends ActionSupport{ private Team team ; @Resource private TeamService teamService ; private List<Team> teams ; public List<Team> getTeams(){ return teams ; } public void setTeams(List<Team> teams){ this.teams = teams ; } public Team getTeam(){ return team ; } public void setTeam(Team team){ this.team = team ; } public String execute(){ HttpServletResponse response = ServletActionContext.getResponse() ; response.setContentType("text/html;charset=gbk") ; try{ String str ="<font color='red' font='4'> * 该组名可以使用!</font>" ; String teamName = team.getName(); PrintWriter out = response.getWriter() ; teams = teamService.getTeams() ; for(Team team:teams){ if(teamName.equals(team.getName())){ str ="<font color='red' font='4'> * 组名已存在,请重新输入!</font>" ; break ; } } out.print(str) ; }catch(Exception e){ e.printStackTrace() ; } return null ; //返回结果不是”success” 也不是 ”error” } }