ajax调用函数完成后执行函数

Question

我想知道当具有 ajax 调用的函数完成时，哪种方式是执行函数的最佳方式。

我的代码：

   jQuery.when(AjaxCallToBokningar()).done(function () {

            console.log("AjaxCallComplete");
        });


    function AjaxCallToBokningar() {
    var url = `${_spPageContextInfo.webAbsoluteUrl}/_api/web/lists/getbytitle('Bokningar')/items

    var call = jQuery.ajax({
        url: url,
        type: "GET",
        dataType: "json",
        headers: {
            Accept: "application/json;odata=verbose"
        }
    });

    //Done
    call.done(function (data, textStatus, jqXHR) {
        //Filling globalArray
        window.globalBokningsArray = data.d.results;
    });

    //Fail
    call.fail(function (jqXHR, textStatus, errorThrown) {
        console.log('Loading Bokningar content faild: ' + textStatus + jqXHR.responseText);
    });
}

我是在正确的轨道上还是有更好的方法？

Answer 1

如果您希望能够进行 Ajax 调用，然后在完成后调用函数，您可以使用函数引用作为参数并像这样执行...

function AjaxCallToBokningar(doneCallback) {
    var url = `${_spPageContextInfo.webAbsoluteUrl}/_api/web/lists/getbytitle('Bokningar')/items

    var call = jQuery.ajax({
        url: url,
        type: "GET",
        dataType: "json",
        headers: {
            Accept: "application/json;odata=verbose"
        }
    });

    //Done
    call.done(function (data, textStatus, jqXHR) {
        //Filling globalArray
        window.globalBokningsArray = data.d.results;
        doneCallback();
    });

    //Fail
    call.fail(function (jqXHR, textStatus, errorThrown) {
        console.log('Loading Bokningar content faild: ' + textStatus + jqXHR.responseText);
    });
}

那么你可以这样称呼它......

function ajaxCallComplete1() {
    // this is executed after the 1st call is done - do something here 
}

function ajaxCallComplete2() {
    // this is executed after the 2nd call is done - do something here 
}

AjaxCallToBokningar(ajaxCallComplete1);
AjaxCallToBokningar(ajaxCallComplete2);

或者...

AjaxCallToBokningar(function() {
    // this is executed after the call is done - do something here 
});

Answer 2

你也可以试试这样的：（未测试）

function ajaxCallToBokningar() {
  var url = `${_spPageContextInfo.webAbsoluteUrl}/_api/web/lists/getbytitle('Bokningar')/items`;
  var options = {
    url: url,
    type: "GET",
    dataType: "json",
    headers: {
      Accept: "application/json;odata=verbose"
    }
  };

  return jQuery.ajax(options);
}


function updateBoknigarArray(data) {
  window.globalBokningsArray = data.d.results;
}

function showError(jqXHR, textStatus, errorThrown) {
  console.log('Loading Bokningar content faild: ' + textStatus + jqXHR.responseText);
}

ajaxCallToBoknigar()
  .done(updateBoknigarArray)
  .fail(showError)