第三:使用回调函数监视请求
通过XMLHttpRequest对象我们向服务器发送了异步请求,那我们怎样才能知道请求已经完成了呢?因此处理异步通信的第二个部分是在代码中设置一个入口点,以便在调用结束的时候可以获取结果信息。这通常是通过分配一个回调函数来实现的。
回调函数非常适合用于大多数现代UI工具箱中的事件驱动的编程方法。
以下我们重写sendRequest()函数,如下:
var req=null; //声明一个全局变量
function sendRequest(url,params,HttpMethod) {
if(!HttpMethod){
HttpMethod="GET";
}
req=getXMLHttpRequest();
if(req){
req.onreadystatechange=onReadyStateChange; //注意这就是onreadystatechange回调函数用来监视请求。具体是通过自定义的Javascript函数onReadyStateChange()来进行事件处理。
req.open(HttpMethod,url,true);
req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
req.send(params);
}
}
以下的回调函数onReadyStateChange就是用来处理从服务器得到的响应信息。
view sourceprint?01 function onReadyStateChange(){
02 var data=null;
03 if (req.readyState==4){
04
05 if (req.status==200) {
06 data=req.responseText;
07 } else {
08 data="loading.....["+req.readState+"]";
09 }
10
11 }
12 .....在这可以做一些与此返回信息有关的操作,比如输出信息等。
13 }
上述代码中使用了XMLHttpRequest对象的responseText属性,以文本字符串的形式获取响应中的数据。对于简单的数据来说这是有用的。当我们需要服务器返回更大的结构化的数据集,就可以使用responseXML属性。如果已经将响应的MIME类型正确设置为text/xml,这个属性就会返回一个DOM文档,因此我们可以使用DOM的属性和函数(例如getElementById()和childNodes)来对它进行处理。
JQuery Ajax篇
jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据
jQuery 的底层 AJAX 实现。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该对象,但特殊情况下可用于手动终止请求。$.ajax() 只有一个选项参数:参数 key/value 对象,包含各配置及回调函数信息。详细参数选项见下。 参数名
类型
描述
url
String
(默认: 当前页地址) 发送请求的地址。
type
String
(默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。
timeout
Number
设置请求超时时间(毫秒)。此设置将覆盖全局设置。
async
Boolean
(默认: true) 默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。










