用原生JS寫PHP裏的Ajax

 1 // 封裝的 ajax網絡請求函數  2 // obj 是一個對象  3 function AJAX(obj){  4  // 一、建立 ajax 對象  5  var ajaxObj = null;  6  if (window.XMLHttpRequest) {  7  ajaxObj = new XMLHttpRequest();  8  }else{  9  ajaxObj = new ActiveXObject("Microsoft.XMLHTTP");; 10  } 11 
12  // 設置請求的類型 13  obj.type = obj.type.toUpperCase() || "GET"; 14 
15  // 若是是get請求,而且須要傳遞參數,則須要給 url後面拼接參數 16  if (obj.type == "GET") { 17  var arr = []; // 定義數組,用於把對象存儲到數據裏面 18  for(var key in obj.data){ 19  arr.push(key+"="+obj.data[key]); 20  } 21         // 用&分隔數組,讓其轉化爲相似:name=gxm&age=18的形式 22  var str = arr.join("&"); 23  obj.url = obj.url +"?"+str; 24  // 撥號 25  ajaxObj.open(obj.type,obj.url,true); 26  //2.1設置頭文件 27  ajaxObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded") 28 
29 
30         // 發送"name=123&dad=131" 31  ajaxObj.send(); 32  }else{ 33  var arr = []; // 定義數組,用於把對象存儲到數據裏面 34  for(var key in obj.data){ 35  arr.push(key+"="+obj.data[key]); 36  } 37         // 用&分隔數組,讓其轉化爲相似:name=gxm&age=18的形式 38  var str = arr.join("&"); 39  ajaxObj.open(obj.type,obj.url,true); 40  ajaxObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 41  ajaxObj.send(str); 42  } 43 
44 
45  // 監聽 46  // 47  ajaxObj.onreadystatechange = function(){ 48  if (ajaxObj.readyState == 4) { 49             if (ajaxObj.status >= 200 && ajaxObj.status < 300|| ajaxObj.status == 304) { 50  // 請求成功 51  console.log(ajaxObj.responseText) 52  // obj.success(ajaxObj.responseText); 53  }else{ 54  // 請求失敗 55  obj.error(ajaxObj.status); 56  } 57 
58 
59  } 60  } 61 
62 
63 
64 
65 
66 }
相關文章
相關標籤/搜索