AJAX的無重新整理機制使得在註冊系統中對於註冊名稱的檢測能即時顯示。
常見的使用者註冊是使用者輸入使用者名稱,背景程式檢測資料庫中使用者名稱是否重複而做出註冊的成功與失敗 之提示(當使用者註冊重名時將返回重新註冊),或者稍微人性化一點就是在使用者名稱文字框後添加一個檢 測按鈕,讓使用者檢測後再做註冊。
以上操作,對於使用者體驗方面來說是比較“差勁”的,一個很好的使用者體驗就是:當使用者 輸入完註冊使用者名稱後,Web系統應能即時檢查並即時顯示,並在檢查和顯示的同時不影響當前頁面的操作 。這也就是“非同步擷取資料”的要求,而這正是AJAX的強項
功能展現
當輸入已經存在的使用者名稱(如cnbruce、cnrose)時頁面將顯示重名不能註冊(false),否則將顯示 可以註冊(true),這為使用者的註冊提供了快速的參考,使用者體驗至上。
那麼下面就來說說是如何來實現這樣的功能的。
其實通過如上的t1.htm的原始碼,各位就可以看到AJAX的精髓
首先是定義XMLHttp對象
var xmlHttp = false;
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
xmlHttp = false;
}
}
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
xmlHttp = new XMLHttpRequest();
}
關於這部分內容的說明 請看
接著是自訂函數
function callServer() {
var u_name = document.getElementById("u_name").value;
if ((u_name == null) || (u_name == "")) return;
var url = "cu.asp?name=" + escape(u_name);
xmlHttp.open("GET", url, true);
xmlHttp.onreadystatechange = updatePage;
xmlHttp.send(null);
}