一、需要一個套路:
每次都寫這麼一大堆的代碼,是不是要規範一下呢?
三方面的工作,寫成三個函數,工作會有條理些:
1、創建XHR對象(比上一版進行了增強)
var xhr;//全局變 function createXhr(){ if (window.XMLHttpRequest) {// 針對 IE7+, Firefox, Chrome, Opera, Safari xhr=new XMLHttpRequest(); } else {// 針對 for IE6, IE5 xhr=new ActiveXObject("Microsoft.XMLHTTP"); } }
本函數可以被反覆調用。
2、設定工作參數及綁定函數:
button.onclick=function(){ createXhr();//很方便吧! xhr.open("GET","url?參數1=值1");//設定工作參數 xhr.onreadystatechange=callback;//設定回調函數,"callback"是函數名 xhr.send(null); }
button是舉個例子,代表界面中的一切可能事件!
3,回調函數的定義:
function callback(){ if(xhr.status==200){//代表着服務器正常響應(還記得404嗎) if(xhr.readyState==4){ alert(xhr.responseText);//對返回結果的一切可能處理,都在此處 } } }
以上三部分代碼組合到一起,就是全部AJAX的代碼。
二、POST請求怎麼辦?
xhr.open("POST","url");//此時請求參數不附加在url後面 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");//設定請求頭,必須做! xhr.send("fname=Bill&lname=Gates");//請求參數在這裏