完整的Ajax程序包

前端之家收集整理的这篇文章主要介绍了完整的Ajax程序包前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
/*
 * 完整的Ajax程序包
 *
 */
 //执行 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 || ""
   };
   
   //创建请求对象
   var xml = new XMLHttpRequest();
   
   //初始化异步请求
   xml.open( options.type,options.url,true );
   
   // 我们在请求后等待 5 秒,超时则放弃
   var timeoutLength = options.timeout;
   
   //记录请求是否完成
   var requestDone = false;
   
   //初始化一个 5 秒后执行的回调函数,用于取消请求(如果尚未完成的话)。
   setTiemout(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.protocal == "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;
	 
	 if( type == "Script")
	   eval.call( window,data );
	   
	 // 返回响应数据 (或为 XML 文档或为文本字符串)
	 return data;
   }   
 }
原文链接:https://www.f2er.com/ajax/164860.html

猜你在找的Ajax相关文章