Ajax：AsynchronousJavaScriptandXML
服务器与客户端的语言传输格式
1：HTML：轻松嵌入预订格式
2：XML：通用，但沉重
3：Json：方便简单，但有一定安全隐患
原生Ajax
原理：通过使用XMLHTTP组件XMLHttpRequest的方法，进行异步数据读取。
运行流程：
varrequest=newXMLHttpRequest();
request.open（“method”，“url”）；//建立对服务器的调用
request.send（）；//向服务器发送请求
Request.onreadystatechange=function（）{}；//追踪改变
request.readystate==4//判断响应是否完成，共四个状态
Request.status==200||Request.status==304//判断响应是否可用
request.responseText//以文本格式返回响应结果
request.responseXML//以XML格式返回响应结果
jQuery封装的Ajax方法
1：$.load(url，method，回调函数).直接载入需要的HTML。
Method默认为GET方法
可通过url+空格+selector来选择指定处返回。
如：varurl=this.href+“h2a”；
2：$.get(url，args，回调函数),$.post(url，args，回调函数)；
主页：
<scripttype="text/javascript"src="jquery-1.7.2.js"></script>
<scripttype="text/javascript">
$(function(){
$(":input[name='username']").change(function(){
varval=$(this).val();
val=$.trim(val);
if(val|=""){
varurl="valiateUserName";
varargs={"userName":val,"time":newDate()};
$.post(url,args,function(data){
$("#message").html(data);
});
}
});
})
</script>
</head>
<body>
<formmethod="post"action="">
UserName:
<br/><inputtype="text"name="username">
<divid="message"></div>
<br/>
<inputtype="submit"value="submit"/>
</form>
</body>
</html>
Servlet的配置和映射
<?xmlversion="1.0"encoding="UTF-8"?>
<web-appversion="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">
<servlet>
<servlet-name>valiateUserNameServlet</servlet-name>
<servlet-class>valiateUserNameServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>valiateUserNameServlet</servlet-name>
<url-pattern>/valiateUserName</url-pattern>
</servlet-mapping>
</web-app>
继承自HttpServlet的valiateUserNameServlet
importjava.io.IOException;
importjava.util.Arrays;
importjava.util.List;
importjavax.servlet.ServletException;
importjavax.servlet.http.HttpServlet;
importjavax.servlet.http.HttpServletRequest;
importjavax.servlet.http.HttpServletResponse;
publicclassvaliateUserNameServletextendsHttpServlet{
privatestaticfinallongserialVersionUID=1L;
publicvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{
List<String>userName=Arrays.asList("AA","BBB","CCC");
Stringusername=request.getParameter("userName");
Stringresult=null;
if(userName.contains(username)){
result="<fontcolor='red'>该用户名已经被使用</font>";
}else{
result="<fontcolor='red'>该用户名可以被使用</font>";
}
//response常用的三个方法
response.setContentType("text/html;charset=UTF-8");
response.setCharacterEncoding("UTF-8");
response.getWriter().print(result);//在浏览器中打印
}
}
注意：1.jQuey中的ajax方法中url，必须和WEB.XML中Servlet的数据匹配
2.可通过$("#message").html(data);的方式在指定位置显示需要的内容
3.谨记List<String>userName=Arrays.asList("AA","CCC");
4.List的contains（）方法，判断是否包含
易-14-10-21-1-25
