JQuery ajax调用的返回值

Posted 2023-02-22

【中文标题】JQuery ajax调用的返回值

【英文标题】：Return value of JQuery ajax call

【发布时间】：2012-06-01 21:31:02

【问题描述】：

我希望这个函数返回 ajax 调用是否成功。有什么办法可以做到这一点？我下面的代码没有这样做。

function myFunction(data) 
var result = false;
$.ajax(
    type: "POST",
        contentType: "application/json",
        dataType: "json",
        url: "url",
        data: data,
        error: function(data)
             result = false;
             return false;
        ,
        success: function(data)
            result = true;
            return true;
        
     );
     return result;

【问题讨论】：

How to return the response from an AJAX call?的可能重复

它可能有助于解决这个问题：***.com/questions/14220321/…

【参考方案1】：

不幸的是，您不能将值返回给包装异步回调的函数。相反，来自 AJAX 请求的成功回调会将数据和控制权移交给另一个函数。我在下面演示了这个概念：

myFunction 的定义：

// I added a second parameter called "callback", which takes a function
 // as a first class object
function myFunction(data, callback) 
    var result = false;
    $.ajax(
        type: "POST",
        contentType: "application/json",
        dataType: "json",
        url: "url",
        data: data,
        error: function(data)
            result = false;

            // invoke the callback function here
            if(callback != null)  
                callback(result);
            

            // this would return to the error handler, which does nothing
            //return false;
        ,
        success: function(data)
            result = true;

            // invoke your callback function here
            if(callback != null) 
                callback(result);                
            

            // this would actually return to the success handler, which does
              // nothing as it doesn't assign the value to anything
            // return true;
        
     );

     // return result; // result would be false here still

回调函数定义：

// this is the definition for the function that takes the data from your
 // AJAX success handler
function processData(result) 

    // do stuff with the result here

调用你的 myFunction：

var data =  key: "value" ; /* some object you're passing in */

// pass in both the data as well as the processData function object
 // in javascript, functions can be passed into parameters as arguments!
myFunction(data, processData);

【参考方案2】：

无需回电。您可以使用 async 属性来实现这一点。

function myFunction()
    var retVal;
    $.ajax(
        url:url,
        method: GET/POST,
        data: data,
        async: false,
        success:function(response) 
            retVal = response;
        
    );
    return retVal;

【讨论】：

我认为这不是一个好主意。众所周知，网站上的同步 HTTP 请求会导致延迟和挂起，因为在服务器返回响应之前，其余代码无法执行。这使事情变得缓慢且无法使用。事实上，在jQuery 1.8 this behavior is deprecated.

【参考方案3】：

您可以在 AJAX 配置中指定 async: false，尽管文档指出这也会在 AJAX 调用期间锁定浏览器，因此不建议这样做。

【讨论】：

嗯好的。那么就没有其他可能实现这样的目标了吗？

+1，不知道甚至可以禁用异步行为，即使我看不到我会选择这样做。

您可以使用 Deferreds 返回一个对象，您可以稍后附加成功/失败回调：api.jquery.com/category/deferred-object

【参考方案4】：

不，myFunction 无法返回 ajax 调用成功，因为 ajax 调用是异步完成的。

您的代码将按此顺序执行：

var result = false; $.ajax 将请求发送到服务器。 return result（仍设置为 false）。 当收到来自服务器的响应时，将调用包含result = false 或result = true 的成功或错误处理程序。

处理此问题的正确方法是将任何依赖于 ajax 代码结果的代码移到成功和错误函数中。

【参考方案5】：

添加这个对你有帮助的属性

async: false