自己封装的ajax
/*** ITCAST WEB* Created by lsy on 2016/5/24.*/
/** 1. 請求的類型 type get post* 2. 請求地址 url* 3. 是異步的還是同步的 async false true* 4. 請求內容的格式 contentType* 5. 傳輸的數據 data json對象** 6.響應成功處理函數 success function* 7.響應失敗的處理函數 error function** 這些都是動態參數 參數對象 options* *//*封裝一個函數*/
window.$ = {};
/*申明一個ajax的方法*/
$.ajax = function(options){if(!options || typeof options != 'object'){return false;}/*請求的類型*/var type = options.type || 'get';/*默認get*//*請求地址 */var url = options.url || location.pathname;/*當前的地址*//*是異步的還是同步的 */var async = (options.async === false)?false:true;/*默認異步*//*請求內容的格式 */var contentType = options.contentType || "text/html";/*傳輸的數據 */var data = options.data || {};/*{name:'',age:''}*//*在提交的時候需要轉成 name=xjj 這種格式*/var dataStr = ''/*數據字符串*/for(var key in data){dataStr += key+'='+data[key]+'&';}dataStr = dataStr && dataStr.slice(0,-1);/*ajax 編程*/var xhr = new XMLHttpRequest();/*請求行*//*(type=='get'?url+'?'+dataStr:url)判斷當前的請求類型*/xhr.open(type,(type=='get'?url+'?'+dataStr:url),async);/*請求頭*/if(type == 'post'){xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');}/*請求主體*//*需要判斷請求類型*/xhr.send(type=='get'?null:dataStr);/*監聽響應狀態的改變 響應狀態*/xhr.onreadystatechange = function(){/*請求響應完成并且成功*/if(xhr.readyState == 4 && xhr.status == 200){/*success*/var data = '';var contentType = xhr.getResponseHeader('Content-Type');/*如果我們服務器返回的是xml*/if(contentType.indexOf('xml') > -1){data = xhr.responseXML;}/*如果我們的服務器返回的是json字符串*/else if(contentType.indexOf('json') > -1){/*轉化json對象*/data = JSON.parse(xhr.responseText);}/*否則的話他就是字符串*/else{data = xhr.responseText;}/*回調 成功處理函數*/options.success && options.success(data);}/*計時請求xhr.status不成功 他也需要的響應完成才認作是一個錯誤的請求*/else if(xhr.readyState == 4){/*error*/options.error && options.error('you request fail !');}}
}
$.post = function(options){options.type = 'post';$.ajax(options);
}
$.get = function(options){options.type = 'get';$.ajax(options);
}
?
轉載于:https://www.cnblogs.com/7qin/p/9678060.html
總結