Javascript 仅当列表中添加了ajax请求时才调用ajax请求 安装程序

我有一个表单，它使用一系列复选框来确定页面上选择的数字：

它所做的是在选中时，它向控制器发出呼叫，控制器将保存所选内容并根据其当前数据返回新的已检查金额

代码如下所示

$'myId'。'单击'，'。选择类输入'，函数{ const inputCheckBox=此； inputCheckBox.disabled=true； $inputCheckBox.addClass'disabled-checkbox' $.ajax{ 方法：邮寄， url:@url.Actionc=>c.MyEndPointModel.ItemId，null， 数据：{ boxWasChecked:inputCheckBox.checked } }.donefunction数据{ UpdateFieldsinputCheckBox，data；//这将更新下面的列页脚和“总量”字段 }.失效函数数据{ //错误检查和处理在这里 }.alwaysfunctiondata{ inputCheckBox.disabled=false； $inputCheckBox.removeClass'disabled-checkbox' }; }; 这在一次选择一个时非常有效，甚至在选择多个时通常也有效

问题 当用户非常快地选择它们时，就会出现问题，有时最后一个完成的请求不是最后一个进入/从控制器端的数据库中获取数据的请求，因此它会返回错误的总数计算

请参见下图，其中数学值应为11。请记住，它是添加每个框的值，而不是选中的框数，但报告为6。 如果我选择final复选框，它会正确地报告12，因为它有所有正确的呼叫数据

我被困的地方 我认为我需要以某种方式列出一个ajax调用列表，然后只有在请求或其前面的所有其他请求完成后添加了请求时才取消请求。我不知道如何使用ajax调用实现这一点

我一直在玩弄并试图让它正常工作，但可以在promise.all[myListOfAjaxCalls]中获得添加到堆栈的承诺

我正在努力的代码摘要

---

我认为创建一个包含所有请求的列表是正确的，但是因为您使用jQuery进行异步调用，所以应该使用来等待所有请求完成。Promise.all不起作用，因为$.ajax没有实现与新Promise相同的接口，所以需要使用jQuery操作符来处理它

如上所述，您可以将列表用于所有异步调用，然后执行以下操作：

$。当…预调用列表 .done…allResponses=>{ //做点什么 } .catcherrors=>{ //处理错误 }; 请注意，我使用es6中的扩展运算符将所有请求扩展到when，并将所有响应聚合到响应列表中

关于排列语法：

---

如果你不能使用es6语法，我建议你学习并使用js函数的apply方法，这会给你同样的结果。

谢谢你的回答！如果您认为promise会更好，我不需要使用ajax。不管怎样，根据您的回答，我将如何称呼这个$。当与我当前的ajax调用相关时？另外，看起来Promises和ajax确实可以一起使用Promise。使用ajax，我们必须将ajax调用转换为Promise，例如：const ajaxToPromise=ajaxCall=>new Promiser解决方案，拒绝=>ajaxCall.doneresolve.catchreject，然后执行类似于promisecall.mapajaxToPromiseCool的操作。但是，我如何将该列表与输入一起排队？也许是使用计时器或类似的东西每秒执行一次PromiseCall列表？因为上面的ajax调用会立即执行

var listOfPromiseCalls = []

$('#myId').('click', '.selectorClass input', function() {
     // my checkbox is clicked
    listOfPromiseCalls.push(myAjaxCall/myPromise)
    // Psudeo code   
    // begin request if it is the only one in the list
    // else
        // kick off other requests that are in existing list infront of it
    // if other requests finish before another input is clicked, begin this request
});