标签：
Ajax的工作原理相当于在用户和服务器之间加了—个中间层,使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像—些数据验证和数据处理等都交给Ajax引擎自己来做,只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求。 Ajax的一个最大的特点是无需刷新页面便可向服务器传输或读写数据,这一特点主要得益于XMLHTTPRequest对象。
XMLHttpRequest 对象方法
方法 描述
abort() 停止当前请求
getAllResponseHeaders() 作为字符串返问完整的headers
getResponseHeader("headerLabel") 作为字符串返问单个的header标签
open("method","URL"[,asyncFlag[,"userName"[, "password"]]]) 设置未决的请求的目标 URL, 方法, 和其他参数
send(content) 发送请求
setRequestHeader("label", "value") 设置header并和请求一起发送
属性 描述
onreadystatechange 状态改变的事件触发器
readyState 对象状态(integer):
0 = 未初始化
1 = 读取中
2 = 已读取
3 = 交互中
4 = 完成
responseText 服务器进程返回数据的文本版本
responseXML 服务器进程返回数据的兼容DOM的XML文档对象
status 服务器返回的状态码, 如:404 = "文件末找到" 、200 ="成功"
statusText 服务器返回的状态文本信息
jsp页面添加的代码：
<script type="text/javascript">
window.onload = function() {
document.getElementById("btn").onclick = function() {
var xhr ;
if (window.XMLHttpRequest) {
xhr=new XMLHttpRequest();
} else {
xhr=new ActiveXObject(Microsoft.XMLHTTP);
}
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {//说明响应结束
if (xhr.status == 200) {//说明响应成功
alert(xhr.responseText)
}
}
}
//第一个参数是提交的方式，第二个参数是请求的目标url（后面可以带参数，后台可以通过request.getParameter(）方法获取），第三个参数是是否异步传输。
xhr.open("get", "/ajaxTest/test?name=zhangsan",true)
xhr.send();
/*
使用send之前要设置这些参数,同样地后台可以通过request.getParameter()方法获取,send()方法相当是将数据封装在表单中提交到后台；
但是经过实验，使用send方法时，open（）方法中的提交方式需是post，否则后台获取不到参数,而在open（）方法中带参数则没有这个问题。
*/
//xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=utf-8")
//xhr.send("name=zhangsan");
}
}
</script>
这是服务端代码：
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");//在获取printwriter之前设置编码方式，否则会发生乱码
System.out.println("已经提交到了servlet");
System.out.println(request.getParameter("name"));
PrintWriter printWriter=response.getWriter();
printWriter.print("这是服务端发送的数据");
printWriter.flush();
printWriter.close();
}
这是实验结果：
标签：
原文地址：http://www.cnblogs.com/hello-daocaoren/p/5793862.html
