AJAX核心代碼

AJAX核心代碼就只有4步

1. 創建AJAX核心對象XMLHttpRequest（瀏覽器內置的，可以直接使用）
2. 註冊回調函數
3. 開啓瀏覽器和服務器的通道
4. 發送AJAX請求

以下是以判斷是否被註冊過爲例子

.

//1、創建AJAX核心對象XMLHttpRequest（瀏覽器內置的，可以直接使用）
var xhr;
if(window.XMLHttpRequest){
	xhr = new XMLHttpRequest();
}else{
	//不支持XMLHttpRequest對象，IE5和IE6是不支持的，它支持ActiveXObject對象
	//IE5和IE6版本使用的是ActiveXObject這個內置對象發送ajax請求
	xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
//alert(xhr);

//2、註冊回調函數
//程序執行到這裏的時候，後面的回調函數並不會執行，只是將回調函數註冊給xhr對象
//等xhr對象的readyState發生改變的時候，後面的回調函數會執行
/*
	XMLHttpRequest對象在請求和響應的過程中，該對象的readyState狀態從0-4：
		0: 請求未初始化 
		1: 服務器連接已建立 
		2: 請求已接收 
		3: 請求處理中 
		4: 請求已完成，且響應已就緒 
	xhr.readyState == 0
	xhr.readyState == 1
	xhr.readyState == 2
	xhr.readyState == 3
	xhr.readyState == 4
*/
xhr.onreadystatechange = function(){//xhr對象的readyState的值發生改變的時候，回調一次
	if(xhr.readyState == 4){//服務器端響應結束
		//404錯誤
		//500錯誤
		if(xhr.status == 200){//200表示服務器正常響應結束
			//var s = xhr.responseText;
			//alert(s);
			//alert(xhr.responseText);
			//根據xhr.responseText來執行想要操作
			if(xhr.responseText=="1"){
				nameTip.innerHTML = "<font style='color:red'>已被註冊</font>";
			}else if(xhr.responseText=="0"){
				nameTip.innerHTML = "<font style='color:green'>可以註冊</font>";
			}
		}else{
			//彈出錯誤代碼（xhr.status屬性可以獲取到HTTP的響應狀態碼）
			alert(xhr.status);
		}
	}
}

//給按鈕對象註冊一個鼠標單擊事件，當按鈕上發生鼠標單擊的時候，執行回調函數。
//myBtn.onclick = function(){}


//3、開啓瀏覽器和服務器的通道
/*
	method：指定請求方式爲get還是post
	url：請求路徑
	async：true / false （true表示支持異步，false表示支持同步），目前我們同一寫成true
*/

/*GET方法
xhr.open("GET","/aa/ajax_name?userName="+userName,true);//這裏只是開啓通道，不發送請求
*/
//這裏的"/aa/ajax_name"或者"/abcd/getValues"是servlet的映射地址

xhr.open("POST","/abcd/getValues",true);//這裏只是開啓通道，不發送請求
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");


//4、發送AJAX請求
/*GET方法
//xhr.send();//這裏纔會發送請求
*/
xhr.send("userName="+userName);