这是一本javascript书上的代码,对Ajax调用进行了封装。
调用这个函数需要自己实现options.onSuccess()函数。
<script LANGUAGE="JavaScript"> //执行Ajax的通用函数 function ajax(options){ // 如果用户没有提供某个选项的值,就用默认值替代 options = { // HTTP请求的类型 type: options.type || "POST", // 请求的URL url: options.url || "", // 请求超时的时间 timeout: options.timeout || 5000, // 请求失败、成功或完成时执行的函数 onComplete: options.onComplete || function(){}, onError: options.onError || function(){}, onSuccess: options.onSuccess || function(){}, // 服务器将会返回的数据类型,这一默认值用于判断服务器返回的数据并做相应动作 data: options.data || "" }
if (typeof XMLHttpReques == "undefined") { XMLHttpRequest = function(){ // IE使用ActiveXObject来创建新的XMLHttpRequest对象 return new ActiveXObject( navigator.userAgent.indexOf("MSIE 5") >= 0 ? "Microsoft.XMLHTTP" : "Msxml2.XMLHTTP" ); }; }
// 创建请求对象 var xml = new XMLHttpRequest();
// 初始化异步请求 xml.open(options.type, options.url, true);
// 请求后等待5秒,超时则放弃 var timeoutLength = options.timeout;
// 记录请求是否成功完成 var requestDone = false;
// 初始化一个5秒后执行的回调函数,用于取消请求(如果尚未完成的话) setTimeout(function(){ requestDone = true; }, timeoutLength);
// 监听文档的状态更新 xml.onreadystatechange = function(){ // 保持等待,直到数据完全加载,并保证请求并未超时 if (xml.readyState == 4 && !requestDone) {
// 检查请求是否成功 if (httpSuccess(xml)) { // 以服务器返回的数据作为参数调用成功回调函数 options.onSuccess(httpData(xml, options.type)); } else { // 否则就发生了错误,执行错误回调函数 options.onError(); }
// 调用完成回调函数 options.onComplete();
// 为避免内存泄漏,清理文档 xml = null; } };
xml.send();
// 判断HTTP请求响应是否成功 function httpSuccess(r){ try{ // 如果得不到服务器状态,且我们正在请求本地文件,认为成功 return !r.status && location.protocol == "file:" || // 所有200到300间的状态码表示成功 (r.status >= 200 && r.status < 300) || // 文档未修改也看作是成功 r.status == 304 || // Safari浏览器在文档未修改时返回空状态 (navigator.userAgent.indexOf("Safari") >= 0 && typeof r.status == "undefined"); } catch(e){ // 若检查状态失败,就假定请求是失败的 return false; } } // 从HTTP响应中解析正确数据 function httpData(r, type){ // 获取Content-type的首部 var ct = r.getResponseHeader("content-type"); // 若没有提供默认的类型,判断服务器返回的是否是XML形式 var data = !type && ct && ct.indexOf("xml") >= 0; // 若是XML,获得XML文档对象,否则返回文本内容 data = type == "xml" || data ? r.responseXML : r.responseText;
if (type == "script") { // 若指定类型是“script”,则以JavaScript形式执行返回文本 eval.call(window, data); } // 返回响应数据 return data; } } </script>
|
阅读(829) | 评论(0) | 转发(0) |