如何使函数等到所有jQuery Ajax请求在另一个函数内完成?
简而言之,我需要等待所有Ajax请求在执行下一个之前完成.但是怎么样?
我试图找到有关以下jQuery函数的更多信息:
jQuery.active
Run Code Online (Sandbox Code Playgroud)
它被描述为测试到服务器的活动连接的数量,并且当连接数为零时将评估为真.
我在jQuery网站上找不到关于此功能的任何信息,并且想知道是否有人知道我在哪里.
我正在一个动态的在线表单网站上工作.在主窗体中,我有多个子窗体,可以动态添加和删除.
<div class='subform'>
//form fields
<input ...>
...
<button class='subform_submit'>
</div>
Run Code Online (Sandbox Code Playgroud)
对于每个子表单,我在子表单的提交按钮上绑定一个AJAX调用,如下所示:
$('#main').on('click', '.subform_submit', function(){
// Get this subform's user input
...
$.ajax({
url: ..,
type: ..,
data: /* this subform's data */
});
});
Run Code Online (Sandbox Code Playgroud)
因此,在该页面中,根据用户的选择,我可能有0到10个子表单.我还在页面底部有一个主提交按钮,可以将这些子表单和主表单的数据一起提交.
$('#main').on('click', '#submit', function(e){
$('.subform_submit').click(); // Submit each subform
bootbox.confirm({ });
})
Run Code Online (Sandbox Code Playgroud)
单击主提交按钮后,我想显示加载图片,然后显示一个对话框(我bootbox.confirm()在这里使用),直到所有AJAX调用完成.此对话框告诉用户已提交包含子表单的整个表单.但问题是每个AJAX调用可能需要2秒钟才能完成,我不知道调用可能有待完成.如何编写此主提交按钮,以便:
我正在编写一个脚本,我需要循环一组 AJAX 请求:
$('#fetchPosts').click(function(){
for(var i=0; i < link_array.length; i++) {
settings = {
// some object not relevant
}
var status = main_ajaxCall(settings, i); // ajax call
}
});
function main_ajaxCall(settings, i) {
$.ajax({
type: "POST",
url: "../model/insert.php",
data:{obj_settings: settings},
dataType: "json",
cache: false,
success: function (data) {
// some handeling here
return 0;
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
return 1;
},
};
Run Code Online (Sandbox Code Playgroud)
为什么 AJAX 请求会立即触发?它似乎没有等待 model/insert.php 的响应,有没有办法强制它在触发下一个 AJAX 请求之前等待响应?
编辑1:
看来我没说清楚,抱歉,我不想等,我想排队接听电话。
我无法一次性拨打电话,这在我目前的情况下是不可能的。
我正在研究一个带有add_record方法的jQuery插件(见下文).如果查看函数定义,有两个$.each循环将值附加到plugin.payload.
现在,一切正常.但是,如果记录或选项真的很大怎么办?$.each()在发出传输呼叫之前,我是否需要关注未完成?
如果是这样,解决这个问题的最佳方法是什么?
plugin.add_record = function (records, options, callback) {
if (typeof (options) == "function") {
callback = options;
options = undefined;
}
if (options) {
$.each(options, function (index, value) {
plugin.payload.append($(value));
});
}
$.each(records, function (index, value) {
plugin.payload.append($(value));
});
transmit('API_AddRecord', plugin.payload, 'db', function (data) {
return typeof (callback) == "function" ? callback(data) : data;
});
}
Run Code Online (Sandbox Code Playgroud) 我有一个函数,它有许多不同的函数调用,里面有很多ajax调用.我如何知道所有被触发的ajax调用是否$("#save").click(...)已完成?
$("#save").click(function() {
saveUpdateSeatDetails();
markAbsent();
setTimeout(function() {
location.reload();
}, 369);
});
Run Code Online (Sandbox Code Playgroud)
我尝试过使用async: false,但我得到了交战,表示它已被弃用.
我还提到了如何知道所有ajax调用何时完成?.但是,这适用于整个页面.我希望这仅适用于特定功能.
(没有ES6)