标签:
XmlHttpRequest对象的基本方法有:
1) abort():停止发送当前请求
2) getAllResponseHeader():获取服务器的全部响应头
3) getResponseHeader("headerLabel”):根据响应头的名字,获取对应的响应头
4) open(“method”,”URL”,”[,asycFlag[,”userName”[,password]]]”):建立与服务器URL的连接,并设置请求的方法,以及是否使用异步请求。如果远程服务需要用户名、密 码,则 提供对应的信息。
5) send(content):发送请求。其中content是请求参数
6) setRequestHeader(“label”,”value”):在发送请求之前,先设置请求头
下面的页面是向服务发送请求,处理响应时将所有的响应全部输出。我们设置个多选下拉框,里面包含了“中国”、“美国”、“日本”,选择其中一个都会输出消息提示。
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("您所请求的页面有异常。"); } }
上面的例子中,主要实现的功能就是,当前页面向其它页面发送异步请求,当请求成功后,getAllResponseHeaders()就会获取方法的所有请求头,并将请求头以敬告框和页面输出两种方式输出。(源码:http://pan.baidu.com/s/1bpLUsAN 密码:trws)
标签:
原文地址:http://blog.csdn.net/owen_william/article/details/51337789