ajax同步,非同步簡單的介紹
星期天一個人搗鼓個人網站的事情,read8686.com,如果哪位開發者又歡迎大家一起探討,在文章的有我的微信
就是這樣的一個註冊的頁面,其實我要實現的功能是什麼啊,就是在使用者註冊的時候判斷在資料庫裡面是否存在相同的郵箱和使用者名稱,如果這樣的就允許進行註冊,註冊我用到了兩個介面,一個是在註冊之前去判斷是否存在相同的使用者名稱,和郵箱,另外的一個介面是將使用者所有輸入的資訊傳遞到後臺
按照這個邏輯,我應該首先是判斷是否存在相同的使用者名稱:
function isAlreadyHaveUser(email, loginname) { var num=1; var param = { "email" : email, "loginname" : loginname } $.ajax({ url : localhostPaht + projectName + "/userinfo/isalreadyuser", type : 'post', data : JSON.stringify(param), dataType : 'json', contentType : 'application/json;charset=utf-8', success : function(data) { num=data.count; }, error : function(error) { console.log('介面不通' + error); num=0; } }); return num; }
這個便是我的呼叫介面用到的程式碼了,這個是用來判斷的,我們可以注意到的是在這個程式碼裡面是存在一個返回值的,並且這個返回值是在呼叫了介面之後才能進行確定,但是我在使用的使用,也就是點選註冊的時候:
$("#registbtn").on("click",function() { var loginname = $("#loginname").val(); var email = $("#email").val(); var phone = $("#phone").val(); var password = $("#password").val(); var confirmpwd = $("#confirmpassword").val(); if (!dataValidate(password, confirmpwd)) { layer.alert("兩次密碼輸入不一致"); } else { var params = { "loginname" : loginname, "email" : email, "phone" : phone, "password" : password }; if (isAlreadyHaveUser(email,loginname) == 0) { $.ajax({ url : localhostPaht+ projectName+ "/userinfo/userregister", type : 'post', data : JSON.stringify(params), async:false, dataType : 'json', contentType : 'application/json;charset=utf-8', success : function(data) { layer.alert(data.msg,function() { window.location.href = "login.html"; }); }, error : function(error) { console.log('介面不通'+ error); } }); } else { layer.alert("註冊失敗"); } } });
這個時候我點選註冊按鈕的時候進行的操作:
isAlreadyHaveUser(email,loginname) == 0 關鍵是這個條件,始終為false
我想後臺應該返回為0 的,為什麼這個判斷條件始終為false,我console.log(isAlreadyHaveUser(email,loginname)),輸出的結果是undefined,為什麼是沒有定義,很奇怪其實也不奇怪,這個裡面有用到的ajax的同步和非同步的問題,之前一直聽說ajax的同步和非同步,但是也沒有遇到過具體的情景,其實是這樣的我們知道ajax在執行程式碼 時候並沒有順序性,也就是說可能我在呼叫第一個介面還沒有結束,這樣地方就開始判斷,當然這個時候是沒有返回值的,所以是沒有定義。
關鍵就是我們需要在第一個介面呼叫的之後執行結束然後再去執行其他的函式,這個就涉及到同步,所謂的同步就是等我做完這件事情之後然後再去做其他的事情,但是非同步是我這事情還沒做完,我就要做其他的事情了。
ajax預設的是非同步的,也就是這件事情還沒做完,就可以去執行其他的js程式碼了,我們應該在等第一個介面呼叫完畢之後再去呼叫第二個介面,也就是我們需要讓第一個的ajax同步執行
AJAX中根據async的值不同分為同步(async = false)和非同步(async = true)兩種執行方式;
我在第一個介面中新增屬性:async=false,這樣就實現了第一個ajax執行介面有返回值之後去執行第二個ajax
同步非同步的問題我是這樣理解的,希望對有所幫助
下面是我的微訊號,希望和大家一起學習交流: