注冊頁面剛輸入信息怎么就知道該用戶已被注冊,而不是點擊提交才顯示

????? 很早以前,我們要注冊一個東西要填完一大堆東西點擊提交按鈕后才知道自己的用戶名是否已被注冊,再點擊提交后又有什么信息填寫的不正確,就這樣一次又一次,太麻煩了,但是現在我們填完一欄就會有提示告訴我們信息是否合格。

?????? 那這樣的變化是怎么回事呢?

?????? 很早之前客戶端和服務器采用的數據同步交換,后來有了XMLHttpRequest對象就有了異步的數據交換,也就是AJAX技術。

?????? 在我們平常注冊的頁面上用Js來實現這些,關于頁面的HTML和CSS可以參考“我們經常注冊用的頁面是怎么實現的”。

? ? ? 首先,實例化XMLHttpRequest,我們可以把XMLHttpRequest簡稱為XHR(這個自己可以根據自己的情況來定義),因為IE5 和 IE6 使用 ActiveXObject,所以我們就分情況來寫。

var XHR;

function createxmlHttpRequest(){

???? if(window.ActiveXObject){

?????? xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");

??????? }else {

???????????????? xmlHttp=new XMLHttpRequest();

????????????? }

? }

????? 這樣,第一步就完成了。

? ? ? 接下來,我們就開始發送請求。第一句規定請求的類型、URL 以及是否異步處理請求。括號里最后一個表示異步還是同步,異步時就為true,一般我們默認為異步也可不寫這句,后面這句則是將請求發送到服務器。

XHR.open("GET",url,true);

XHR.send();

? ? ? 如果是post請求,我們還可以像下面這樣寫,中間這句是向請求添加http頭,括號里分別是頭名稱和頭的值,send() 方法中規定您希望發送的數據。當然,post請求也可以像get請求一樣只用那兩句話。

XHR.open("POST","ajax_test.asp",true);

XHR.setRequestHeader("Content-type","application/x-www-form-urlencoded");

XHR.send("fname=Bill&lname=Gates");

? ? 下面對服務器的響應進行監聽,if里的判斷就是readyState和status狀態請求成功時我們做的事情,里面的responseText返回響應的一種形式

XHR.onreadyStatechange=function(){

??????????? if((XHR.readyState==4)&&(XHR.status==200)){

?????????? msg.innerHTML=XHR.responseText;

????? }

}

???? 這就是一個異步請求的一個過程。自己在學習過程中和大家的一些分享,如果有更好的理解和看法,歡迎一起來探討學習。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容