jquery ajax return has no return value solution_jquery

Let’s first look at a simple js of jquery ajax return value

Copy code The code is as follows:

function getReturnAjax{
$.ajax({
type:"POST",
url:"ajax/userexist.aspx",
data:"username=" vusername.value,
success :function(msg){
if(msg=="ok"){
showtipex(vusername.id,"< font color='#ffff00'>This username can use",false)
return true;
}
else
{
showtipex (vusername.id,"The user has been registeredvusername.className="bigwrong";
return false;
}
}
});
}

But when we call this getReturnAjax(), we find that what we always get is false, that is to say, return true and return false have no effect at all. Debugging with firebug under Firefox also proves that the code will not be executed to the return part at all.


Let’s imagine defining a variable first in the function, then assigning it in ajax, and finally returning the variable at the end of the function. Will it be effective? We modify the code as follows:

Copy code The code is as follows:

function getAjaxReturn()
{
var bol=false;
$.ajax({
type:"POST",
url:"ajax/userexist.aspx",
data:"username=" vusername.value,
success:function(msg){
if(msg=="ok"){
showtipex(vusername.id,"< ;font color='#ffff00'>This username can use",false)
// return true;
bol=true;
}
else
{
showtipex(vusername.id,"The user has been Register",false);
vusername.className="bigwrong";
//return false;
}
}
});
return bol;
}

The result still doesn't work. The final solution is 2, as follows


1. Add async:false. That is, it is changed to synchronization. What does it mean? (According to a colleague’s explanation, the following js will not be executed until the ajax has a return value. This makes it clear, no wonder the assignments in many ajax calls in the past did not work). In this way, after ajax has assigned the value to bol, the following js part will be executed. If it was asynchronous just now, it would have been returned before the value could be assigned.

Copy code The code is as follows:

function getAjaxReturn()
{
var bol=false;
$.ajax({
type:"POST",
async:false,
url:"ajax/userexist.aspx",
data:" username=" vusername.value,
success:function(msg){
if(msg=="ok"){
showtipex(vusername.id,"This username can use",false)
// return true;
bol=true;
}
else
{
showtipex(vusername.id,"The user has been registered",false);
vusername.className="bigwrong";
//return false;
}
}
});
return bol;
}

2. Solve this problem by passing in a function.

Copy code The code is as follows:

function getAjaxReturn(success_function,fail_function)
{
var bol=false;
$.ajax({
type:"POST",
url:"ajax/ userexist.aspx",
data:"username=" vusername.value,
success:function(msg){
if(msg=="ok"){
showtipex(vusername.id, "This username can use",false)
success_function(msg);
}
else
{
showtipex(vusername.id,"< ;font color='#ffff00'>The user has been registered",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);
}

On demand Choose the plan you need. Generally, large websites use the second method of passing in functions to handle page prompts in case of success and failure.

Copy code The code is as follows:

//Add async:false. Change it to sync
//Wait until ajax completes assigning value to bol, then execute the following js part. If it is asynchronous, it will be returned before it has time to assign the value.
function vcodeYes() {
var bol = false;
$.ajax(
{
type: "GET",
url: "../Ajax/ValidationCode.ashx ",
data: { txtVcode: $('#<%=txtVcode.ClientID%>').val() },
async: false,
success: function (data) {
if (data == "0") {
$.dialog({ icon: 'warning', follow: document.getElementById('txtVcode'), content: 'Verification code error!' }).time( 1);
changeCaptchaImage('imgVerify2', 'txtVcode');
}
else {
bol = true;
}
}
});
return bol;
}
//If the verification fails, return false, otherwise execute the following function
$('.getVodes').click(function () {
if (vcodeYes()) {
. .
});