jQuery Ajax request使用循环多次调用

e5nszbig 于 2023-10-17 发布在 jQuery

关注(0)|答案(1)|浏览(131)

我需要在jQuery/JavaScript中使用循环执行一个任务。我需要调用一个循环10次，在每次迭代中，我需要进行一次Ajax调用。在每次迭代中，我还需要检查Ajax调用响应中的条件。如果满足条件，那么下一次迭代应该继续，用一个确认框提示用户。否则，循环应该结束。我恳请你在这方面给予协助。

function GetNextBagWeight() {
    let res = "OK";
    var arr = [];
    $.ajax({
        url: '/LoadingControl/GetNextBagWeight?BayId=' + 1,
        cache: false,
        dataType: 'json',
        async: false,
        success: function(response, status, xhr) {
            debugger
            var trHTML = '';
            var count = 1;
            if (response.isSuucess) {
                trHTML = '<tr><td>' + count + '</td><td>' +
                    response.BagWeight + "</td><td>" +
                    CurrentDateWithTimeString() + "</td></tr>";
                $('#tblRunTimeBagData').append(trHTML);
                resp = "OK";
                arr.push("OK")
            } else {
                trHTML = '<tr style="background-color: red;"><td>' + count + '</td><td>' +
                    response.BagWeight + "</td><td>" +
                    CurrentDateWithTimeString() + "</td></tr>";
                $('#tblRunTimeBagData').append(trHTML);
                arr.push("wait")
                if (confirm('Proceed')) {
                    alert('Thanks for confirming, start next iteration');
                }
            }
        }
    });
    
    return res;
}

这里一切都很好确认弹出窗口也会出现。但是，后台的Ajax调用仍然会在下一个迭代中发生，这应该只在单击确认按钮后发生。

jquery

来源：https://stackoverflow.com/questions/77206687/jquery-ajax-request-call-multiple-times-using-loop

1条答案

按热度按时间

daupos2t1#

你需要保证AJAX调用。阅读这篇文章：https://www.taniarascia.com/how-to-promisify-an-ajax-call/
这是一个AJAX调用的promised版本：

function doTheThing() {
  return new Promise((resolve, reject) => {
    $.ajax({
      url: window.location.href,
      type: 'POST',
      data: {
        key: 'value',
      },
      success: function (data) {
        resolve(data)
      },
      error: function (error) {
        reject(error)
      },
    })
  })
}

请注意：

一个承诺被退回
它的目标是成功
失败时被拒绝

她提供了这个用法示例：

doTheThing()
  .then((data) => {
    console.log(data)
    doSomethingElse()
  })
  .catch((error) => {
    console.log(error)
  })

现在，你想让它可定制和链接，一个承诺成为下一个的先决条件：

function doTheThing(url, type, data) {
  return new Promise((resolve, reject) => {
    $.ajax({
      url: url,
      type: type,
      data: data,
      success: function (data) {
        resolve(data)
      },
      error: function (error) {
        reject(error)
      },
    })
  })
}

所以，让我们假设你有一个AJAX调用数组，那么：

let currentPromise = undefined;
for (let index = 0; index < myPromises.length; index++) {
    let prom = doTheThing(myPromises[index].url, myPromises[index].type, myPromises[index].data);
    if (!currentPromise) {
        currentPromise = prom;
    } else {
        currentPromise = currentPromise.then(prom);
    }
}

赞(0）回复(0）举报 2023-10-17

我来回答

jQuery Ajax request使用循环多次调用

1条答案

相关问题

热门标签

最新问答