Let's take a look at a simple piece of JavaScript code returned by jquery ajax.
Code
Copy codeThe Code is as follows:
Function getReturnAjax {
$. Ajax ({
Type: "POST", data: "username =" + vusername. value,
Success: function (msg ){
If (msg = "OK "){
Showtipex (vusername. id, " <B> <font color =' # ffff00 '> this user name can be used </font> </B> ", false)
Return true; else showtipex (vusername. id, " <B> <font color =' # ffff00 '> this user has been registered </font> </B> ", false );
Vusername. className = "bigwrong ";
Return false;
}}
However, when we call this getReturnAjax () method, we find that all the obtained results are false, that is, return true and return false do not work at all. Using firebug debugging in Firefox also proves that, the Code does not execute the return part at all.
If we want to define a variable in the function, assign values in ajax, and return the variable at the end of the function, will it work? Modify the Code as follows:
Code
Copy codeThe Code is as follows:
Function getAjaxReturn (){
Var bol = false;
$. Ajax ({
Type: "POST", data: "username =" + vusername. value,
Success: function (msg ){
If (msg = "OK "){
Showtipex (vusername. id, " <B> <font color =' # ffff00 '> this user name can be used </font> </B> ", false)
// Return true;
Bol = true; else showtipex (vusername. id, " <B> <font color =' # ffff00 '> this user has been registered </font> </B> ", false );
Vusername. className = "bigwrong ";
// Return false ;}
Return bol;
The result still does not work. The final solution is as follows:
1. Add async: false. That is, it is changed to synchronous. What does it mean? (According to my colleague, this is to execute the following js only after ajax has the returned value. In other words, the assignment in many ajax calls does not work ). In this way, the following js part is executed only after ajax assigns a value to the bol. If it was just asynchronous, it was no longer time to assign values, and it was already returned.
Code
Copy codeThe Code is as follows:
Function getAjaxReturn (){
Var bol = false;
$. Ajax ({
Type: "POST ",
Async: false, data: "username =" + vusername. value,
Success: function (msg ){
If (msg = "OK "){
Showtipex (vusername. id, " <B> <font color =' # ffff00 '> this user name can be used </font> </B> ", false)
// Return true;
Bol = true; else showtipex (vusername. id, " <B> <font color =' # ffff00 '> this user has been registered </font> </B> ", false );
Vusername. className = "bigwrong ";
// Return false;} return bol;
}
2. pass in a function to solve this problem.
Copy codeThe Code is as follows:
Function getAjaxReturn (success_function, fail_function ){
Var bol = false;
$. Ajax ({
Type: "POST", data: "username =" + vusername. value,
Success: function (msg ){
If (msg = "OK "){
Showtipex (vusername. id, " <B> <font color =' # ffff00 '> this user name can be used </font> </B> ", false)
Success_function (msg );
}
Else showtipex (vusername. id, " <B> <font color =' # ffff00 '> this user has been registered </font> </B> ", false );
Vusername. className = "bigwrong ";
Fail_function (msg );
// Return false ;}
});
Function success_function (info) // do what you want do
Alert (info); funciont fail_function (info) // do what you want do
Alert (info );
}