Javascript 在jQuery'；每个'；函数及其包含的所有AJAX调用？

我是新手。我在某地和其他地方尝试了多种解决方案。我试图遵循这一点，以确保我的函数在所有ajax调用完成之前不会启动。出于某种原因，当我的updateValues函数启动时，控制台日志不会返回在我的'first'jQuery函数中更新的数据。但是，如果在第一次直接单击“saveButton”，控制台日志会显示正确的数据，每个函数都会更新这些数据。我已经学习了所有我发现的例子，但是我被难住了。提前谢谢

$("body").on("click",".saveButton",function(){
    var first = $(".item");
    var i = 0; 
    first.each(function(){
        var $this = $(this);
        var thisID = $this.find(".itemID").html();
        var itemProperties = {'Status': 'New'};
        updateListItem(_spPageContextInfo.webAbsoluteUrl,'TestList',thisID,itemProperties,printInfo,logError);
        i += 1;
        if(i == first.length) {
            updateValues();
        }
        function printInfo()
        {
            console.log('UPDATED!');
        }
        function logError(error){
            alert("An error occurred.");
            console.log(JSON.stringify(error));
        }
    });
    function printInfo(){
        console.log('UPDATED!');
    }
    function logError(error){
        alert("An error occurred.");
        console.log(JSON.stringify(error));
    }
});

function updateValues(){
    var url = _spPageContextInfo.siteServerRelativeUrl+
        "/_api/lists/getbytitle('TestList')/items?";
    $.ajax({
        url: url,
        method: 'GET',
        beforeSend: function (XMLHttpRequest){
            XMLHttpRequest.setRequestHeader('Accept', 'application/json; odata=verbose');
            },
        success: function( data ) {
            console.log(data);
            $(".itemTwo").each(function(){
                var $this =  $(this);
            });
        }   
    }); 
}

function updateListItem(webUrl,listTitle,listItemId,itemProperties,success,failure){
     var listItemUri =  webUrl + "/_api/web/lists/getbytitle('" + listTitle + "')/items(" + listItemId + ")";
     var itemPayload = {
       '__metadata': {'type': "SP.Data.IntakeTESTListItem"}
     };
     for(var prop in itemProperties){
           itemPayload[prop] = itemProperties[prop];
     }
     updateJson(listItemUri,itemPayload,success,failure);
}

function updateJson(endpointUri,payload, success, error){
    $.ajax({       
       url: endpointUri,   
       type: "POST",   
       data: JSON.stringify(payload),
       contentType: "application/json;odata=verbose",
       headers: { 
          "Accept": "application/json;odata=verbose",
          "X-RequestDigest" : $("#__REQUESTDIGEST").val(),
          "X-HTTP-Method": "MERGE",
           "If-Match": "*"
       },   
       success: success,
       error: error
    });
}

---

tl；dr：您运行两个ajax调用，在这种情况下，

GET

响应比

POST

请求更快（可能前面的数据更少，或者其他一些情况），因此您将在第一时间获得过时的数据

我希望更具描述性：

您有两个ajax调用。第一个是

POST

s一些东西，第二个是

GET

s在

POST

请求中更改的东西。不幸的是，它们同时运行。当jsengine看到一些ajax调用时，它不会等待响应执行下一行，而是继续执行。jquery的ajax调用中的回调将在将来响应返回时调用

您可能希望在收到

POST

的成功（或错误，我不知道用例）后运行

GET

。因此，您希望在响应附带的

UpdateJson

之后调用

updateValues

函数。使用回调时，它很混乱-您必须将

updateValue

传递到

updateJson

并在成功时调用它。如果可以，可以使用promises-native

FetchAPI

或类似于

axios的库。它更清晰易读

提示：您可能不想为每个项目运行ajax调用。相反，只运行一个包含所有数据的
POST
（如果您有这样的端点）和一个
GET
，然后对每个
循环执行
，以更新前端

UPDATE我不知道jquery，但我刚刚在链接问题中看到jquery有/methods。使用它们，您可以在其他请求完成后调用下一个ajax请求。
Ok。让我们一步一步走。1.单击
保存按钮
。2. <代码>更新值
为每个项目调用函数。3.成功后
console.log
打印
数据
。4.
数据
错误。5.再次单击
保存按钮
。6.7.数据是正确的。这就是你的意思吗？@Papi当我单击“saveButton”时，它会循环遍历我的每个$（“.item”）div，并使用我的updateListItem函数更新它们相应的列表项。在所有这些更新之后，我希望updateValues函数启动。我的updateValues函数启动，但第一次单击它时，它只记录updateListItem函数刚刚更改的以前的列表值。只有当我再次单击“保存按钮”时，它才会注册更新的值。希望这不是一个太模糊的解释。我希望'updateValues'函数更改列表数据，但我需要有新的值才能这样做。嗯，我看到函数
updateValues
和
updateListItem
只记录了一些值，但它只是实现的替代品，对吗？还有可能导致问题的原因：您有两个非同步运行的异步调用。您可能希望在收到来自
updateListItem
的响应后运行
UpdateJson
。对吗？@Papi是的，对。UpdateJson当前应该在updateListItem之后运行，尽管按照我的设置方式，对吗？