Question

我的函数中有一个链接的Ajax请求。函数A和B是Ajax请求。 A将首先运行，B将在A返回其数据之后运行。

我的问题是函数C是执行函数B的函数。执行函数C时，执行C的按钮将被暂时禁用，直到A && B完成。

如何在下面的函数c中返回值？

我需要在函数c 之后返回true，函数a和b请求返回完整的数据。

我在考虑，如果我在done（），fail（）或always（）内的回调函数上返回true，则该值将返回到回调函数而不是c（）。

function a(methodA) {
    return $.ajax({
        type: "get",
        url: "api/a",
        cache:false,
        data: { method: methodA },
        dataType: "json",
    });
}

function b(methodB) {
    return $.ajax({
        type: "get",
        url: "api/b",
        cache:false,
        data: { method: methodB },
        dataType: "json",
    });
}

function c(data) {
    a(data)
    .done(function(data2) {
        b(data2)
        .done(function(data3) {

        })
        .fail(function(data3) {

        })
        .always(function(data3) {

        })
    })
    .fail(function(data3) {

    })
}

$(document).ready(function() {
    $('#btnC').click(function(event) {
        $('#btnC').prop('disabled', true);
        var c = c(getData);
        if(c == true) {
            $('#btnC').prop('disabled', false);
        }
    });
});

Answer 1

如果您希望python的返回值依赖于异步回调，则不能只返回一个值。您必须返回一个promise，因为要返回的值是根据2个ajax调用发出的异步请求计时的（调用return时不可用）。因此，您可以保证会返回一个值，但不能立即给出该值。

function a() {
  // mock request since content doesn't matter
  return $.get('https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js');
}

function b(fail) {
  // google does not allow cross origin requests
  if (fail) return $.get('https://google.com');

  return a();
}

function c(failB) {
  let requests = [
    Promise.resolve( a() ),
    Promise.resolve( b(failB) ),
  ];
  
  return Promise
    .all(requests)
    .then(results => Promise.resolve(true))
    .catch(error => Promise.reject('one or multiple requests failed'));
}

c().then(result => {
  console.log(result);
}).catch(error => {
  console.log(error);
});

c(true).then(result => {
  console.log(result);
}).catch(error => {
  console.log(error);
});

仅返回值<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>可能有点用处，因为如果诺言得以解决，您就知道一切都成功了。您可以简单地省略该部分，而true承诺的结果将传递results。错误消息也是如此。在上面的代码中，我不使用错误本身，而是生成自己的字符串。如果您对失败的对象更感兴趣，则可以在c中忽略此catch。请参见下面的示例。

function a() {
  // mock request since content doesn't matter
  return $.get('https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js');
}

function b(fail) {
  // google does not allow cross origin requests
  if (fail) return $.get('https://google.com');

  return a();
}

function c(failB) {
  let requests = [
    Promise.resolve( a() ),
    Promise.resolve( b(failB) ),
  ];
  
  return Promise.all(requests);
}

c().then(results => {
  // in this case has 2 the same values since the same url is requested
  results.forEach(resp => console.log(resp.substring(0, 15)));
}).catch(jqXhr => {
  console.log(jqXhr.statusText);
});

c(true).then(results => {
  results.forEach(resp => console.log(resp.substring(0, 15)));
}).catch(jqXhr => {
  console.log(jqXhr.statusText);
});

Answer 2

jQuery Ajax方法返回一个Promise对象。（确切地说，jqXHR）通常，它是这样使用的。

var result =
    $.post("url").done(function() {
        // after ajax.
    });

// called when ajax process done finished.
result.promise().done(function() {
    // blah blah blah
});

但是，当涉及到嵌套的ajax时，您需要比平时更多的工作。
使用then()并返回inner ajax。

function callAjaxs() {
    return $.get("ajaxA").then(function(res) {
        return $.get("ajaxB", res).done(function() {
            // blah blah blah
        });
    });
}

// call function and use promise. (of course, you can also use fail, always)
callAjaxs().promise().done(function() {
    // $('#btnC').prop('disabled', false);
});

如果您不关心细节，我认为这种方法是不错的选择。

从在Jquery中具有Chain Ajax请求的函数返回值

2 个答案: