jQery Ajax 執行順序

項目中，常常需使用到jquery ajax請求後臺數據校驗前端用戶輸入數據的有效性，而後根據服務器返回的結果來肯定是否容許本次的請求數據能夠提交服務器

經過ajax請求後臺校驗前端用戶輸入數據

function checkUserName(userName){
	$.ajax({
		method:"POST",
		url:"../front/checkUserName",
		data:{"userName":userName},
		success:function(data){
			if(data.errCode < 0){
				alert(data.errMsg);
				return true;
			}
		},
		error:function(){
			alert("系統異常，請稍後重試");
			return false;
		}
	});
	return true;
}
$(function(){
	if(!checkUserName($("#userName").val().trim())){return ;}
	$("form").submit();
});

checkUserName函數的返回值始終是true，而且在提交數據到服務器時，會出現請求失敗，回調error函數，可經過瀏覽器控制檯F12查看http請求。究其緣由以下jquery中文文檔所說：

解決此問題的辦法只須要在ajax請求中增長async(默認爲true)參數並賦值爲false，始之爲同步請求，也就是後面的代碼須要等待這次ajax請求結束後在執行，因此，達到此要求的代碼以下:

function checkUserName(userName){
	$.ajax({
		method:"POST",
		async:false,
		url:"../front/checkUserName",
		data:{"userName":userName},
		success:function(data){
			if(data.errCode < 0){
				alert(data.errMsg);
				return true;
			}
		},
		error:function(){
			alert("系統異常，請稍後重試");
			return false;
		}
	});
	return true;
}
$(function(){
	if(!checkUserName($("#userName").val().trim())){return ;}
	$("form").submit();
});