1.前言
XmlHttpRequest对象的基本方法有:
1) abort():停止发送当前请求
2) getAllResponseHeader():获取服务器的全部响应头
3) getResponseHeader("headerLabel”):根据响应头的名字,获取对应的响应头
4) open(“method”,”URL”,”[,asycFlag[,”userName”[,password]]]”):建立与服务器URL的连接,并设置请求的方法,以及是否使用异步请求。如果远程服务需要用户名、密 码,则 提供对应的信息。
5) send(content):发送请求。其中content是请求参数
6) setRequestHeader(“label”,”value”):在发送请求之前,先设置请求头
2.例子
下面的页面是向服务发送请求,处理响应时将所有的响应全部输出。我们设置个多选下拉框,里面包含了“中国”、“美国”、“日本”,选择其中一个都会输出消息提示。
1) 我们需要初始化XMLHttpRequest的对象
// 定义了XMLHttpRequest对象
var xmlrequest;
// 完成XMLHttpRequest对象的初始化
function createXMLHttpRequest()
{
if(window.XMLHttpRequest)
{
// DOM 2浏览器
//alert("1");
xmlrequest = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
// IE浏览器
try
{
//alert("2");
xmlrequest = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
//alert("3");
xmlrequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
}
}
}
}
2) 当选择了下拉框中的任意一个,都需要触发的事件
// 事件处理函数,当下拉列表选择改变时,触发该事件
function change(id)
{
// 初始化XMLHttpRequest对象
createXMLHttpRequest();
// 设置请求响应的URL
var uri = "second.jsp?id=" + id;
// 打开与服务器响应地址的连接
xmlrequest.open("POST", uri, true);
// 设置请求头
xmlrequest.setRequestHeader("Content-Type"
, "application/x-www-form-urlencoded");
// 设置处理响应的回调函数
xmlrequest.onreadystatechange = processResponse;
// 发送请求
xmlrequest.send(null);
}
3) 请求好了相应的页面后,需要回调函数来提示响应信息
// 定义处理响应的回调函数
function processResponse()
{
// 响应完成且响应正常
if (xmlrequest.readyState == 4)
{
if (xmlrequest.status == 200)
{
// 信息已经成功返回,开始处理信息
var headers = xmlrequest.getAllResponseHeaders();
//通过警告框输出响应头
alert("响应头的类型:" + typeof headers + "\n"
+ headers);
// 在页面输出所有响应头
document.getElementById("output").innerHTML = headers;
}
else
{
// 页面不正常
window.alert("您所请求的页面有异常。");
}
}
3.例子说明
上面的例子中,主要实现的功能就是,当前页面向其它页面发送异步请求,当请求成功后,getAllResponseHeaders()就会获取方法的所有请求头,并将请求头以敬告框和页面输出两种方式输出。(源码:http://pan.baidu.com/s/1bpLUsAN 密码:trws)