這裡的checkName()w為什麼不能是我所期待的傳回值(true/false),怎麼獲得chekName()的傳回值,在使用ajax的基礎上?求高人指點,
剛開始學習使用ajax進行表單驗證;遇到這種問題不知道怎麼解決?
,表單的內容是這樣的,下面是幾個主要的驗證函式,
function checkName(){ var name=ele.name.value; if(name!= ""){ xmlhttp=new XMLHttpRequest(); url="http://localhost/chkname.php"; xmlhttp.onreadystatechange =function(){ if(xmlhttp.readyState == 4){ if(xmlhttp.status == 200){ var msg = xmlhttp.responseText; if(msg == '1'){ ele.name.className="";//移除class ele.imgs[0].setAttribute("src","img/right.jpg"); //對應表徵圖 ele.imgs[0].style.display = "inline"; //顯示 return true; }else{ ele.name.className="borderRed";//移除class ele.imgs[0].setAttribute("src","img/wrong.jpg"); //對應表徵圖 ele.imgs[0].style.display = "inline"; //顯示 biaoqian1.innerHTML='該使用者名稱已存在'; return false; } } } } xmlhttp.open('POST',url,true); xmlhttp.send(null); } function check(){ //表單提交則驗證開始 if(checkName()&&checkPassw2()&&checkEmail()){ alert(" 註冊成功"); //註冊成功 return true; } else{ alert("請正確的填寫完資訊!"); return false; } }
回複內容:
這裡的checkName()w為什麼不能是我所期待的傳回值(true/false),怎麼獲得chekName()的傳回值,在使用ajax的基礎上?求高人指點,
剛開始學習使用ajax進行表單驗證;遇到這種問題不知道怎麼解決?
,表單的內容是這樣的,下面是幾個主要的驗證函式,
function checkName(){ var name=ele.name.value; if(name!= ""){ xmlhttp=new XMLHttpRequest(); url="http://localhost/chkname.php"; xmlhttp.onreadystatechange =function(){ if(xmlhttp.readyState == 4){ if(xmlhttp.status == 200){ var msg = xmlhttp.responseText; if(msg == '1'){ ele.name.className="";//移除class ele.imgs[0].setAttribute("src","img/right.jpg"); //對應表徵圖 ele.imgs[0].style.display = "inline"; //顯示 return true; }else{ ele.name.className="borderRed";//移除class ele.imgs[0].setAttribute("src","img/wrong.jpg"); //對應表徵圖 ele.imgs[0].style.display = "inline"; //顯示 biaoqian1.innerHTML='該使用者名稱已存在'; return false; } } } } xmlhttp.open('POST',url,true); xmlhttp.send(null); } function check(){ //表單提交則驗證開始 if(checkName()&&checkPassw2()&&checkEmail()){ alert(" 註冊成功"); //註冊成功 return true; } else{ alert("請正確的填寫完資訊!"); return false; } }
非同步ajax實際上使用了單獨的進程,因此無法擷取到這個傳回值,而且,在調用ajax()方法時你根本無法知道它什麼時候會執行完畢。 因此對於非同步ajax來說,你無法主動的擷取其傳回值,只能提供回調方法,ajax對象可以將參數傳遞到你提供的回調方法中,如上面,自己通過回呼函數獲得了傳回值。
//ajax驗證name
var ajaxResult = false;//全域變數 function ajaxResultdeal(response){ ajaxResult = response; //傳遞給全域變數 if(ajaxResult == '1'){ ele.name.className="";//移除class ele.imgs[0].setAttribute("src","img/right.jpg"); //對應表徵圖 ele.imgs[0].style.display = "inline"; //顯示 ajaxResult= true; } else{ ele.name.className="borderRed";//移除class ele.imgs[0].setAttribute("src","img/wrong.jpg"); //對應表徵圖 ele.imgs[0].style.display = "inline"; //顯示 biaoqian1.innerHTML='該使用者名稱已經存在'; ajaxResult=false; } ajaxResultreturn(); } function ajaxResultreturn(){ if(ajaxResult){return true;} else{ return false; } } function toAjax(url,callback){ xmlhttp=new XMLHttpRequest(); /*url="http://localhost/chkname.php"; */ xmlhttp.onreadystatechange =function(){ if(xmlhttp.readyState == 4){ if(xmlhttp.status == 200){ if(callback) { callback(xmlhttp.responseText); } } } } xmlhttp.open('POST',url,true); xmlhttp.send(null); } function checkName(){ var name=ele.name.value; var url="http://localhost/chkname.php"; var cb = ajaxResultdeal; toAjax(url,cb); } function check(){ //表單提交則驗證開始 if(ajaxResultreturn()&&checkPassw2()&&checkEmail()){ alert(" 註冊成功"); //註冊成功 return true; } else{ alert("請正確的填寫完資訊!"); return false; } }
一樓回答的很詳細。使用ajax的原因是因為非同步載入,這需要你轉變你的思路,不能用同步的思想去寫非同步代碼。
給你一個經典邏輯協助你入門吧
function beforeAjax() { //一些基礎的工作,比如非空驗證,獲得url,參數字串等 doAjax();}function doAjax() { var ajax = new Ajax;//這是偽碼 ajax.onSuccess = afterAjax; //這是偽碼,可能是onSuccess, onReadyStatusChange等任何事件,只要你的ajax對象支援的就行。 ajax.send();}function afterAjax(param1, param2, etc...) { //後續的處理}
這個就是三步走方式的非同步代碼模型了,首先做好準備,然後開始非同步處理,我們不知道非同步處理什麼時候會完成,所以能做的就是告訴非同步處理對象,當xx事發生的時候請調用一下xx方法。