假设我有一些名为makeRequest()
的函数,它向服务器发出AJAX请求。
现在让我们假设给出了这个请求的次数,但我不能异步但同步地执行它们。
例如,我给了5号,我会打电话给makeRequest()
,当它完成后,我会再次打电话给它,当它完成后,我会称之为再次......我最终应该召唤它5次。
我不是JavaScript的专家,但我发现使用回调很容易处理异步调用。
因此,我的makeRequest()
函数接受一个callback
参数,该参数将在请求成功时执行。
在我之前的示例中,我不得不提出5次请求,因此行为应如下所示:
makeRequest(function () {
makeRequest(function () {
makeRequest(function () {
makeRequest(function () {
makeRequest(function () {
});
});
});
});
});
如何为我提供的任何参数设计相同的行为,无论是6,12还是1?
PS:我尝试过很多种方法,最常见的方法是创建while循环,等待标记由完成的请求设置。所有这些方法都使浏览器认为脚本崩溃并提示用户停止脚本。
答案 0 :(得分:2)
简单,递归调用ajax请求,同时跟踪计数变量:
function makeRequest(count, finalCallback){
someAjaxCall(data, function(){
if(count > 1){
makeRequest(count - 1, finalCallback);
} else {
finalCallback && finalCallback();
}
});
}
finalCallback
是一个可选的回调(函数),将在所有请求完成后执行。
答案 1 :(得分:1)
你可以这样做,
var i = 5; // number of calls to you function calling ajax
recurs(i); // call it initially
function recurs(count) {
makeRequest(function() {
count--; // decrement count
if (count > 1) {
recurs(count) // call function agian
}
});
}
答案 2 :(得分:0)
这里我使用promises编写了多个Ajax调用。此功能将同步运行。您可以获取从Ajax执行的当前响应位置。
var ajaxs = {
i : 0,
callback : null,
param : null,
exec_fun : function (i) {
let data_send = this.param[i];
let url = this.url;
this.promise = new Promise(function (res,rej) {
$.ajax({
url: url,
method: 'POST',
data: data_send,
dataType: 'json',
success: function(resvalidate){
res(resvalidate);
}
});
});
this.promise.then(function (resvalidate) {
let resp = resvalidate,
param = ajaxs.param,
pos = ajaxs.i,
callback_fun = ajaxs.callback_fun;
callback_fun(resp,ajaxs.i);
ajaxs.i++;
if( ajaxs.param[ajaxs.i] != undefined){
ajaxs.exec_fun(ajaxs.i);
}
});
},
each : function (url,data,inc_callback) {
this.callback_fun = inc_callback;
this.param = data;
this.url = url;
this.exec_fun(ajaxs.i);
}
};
let url = "http://localhost/dev/test_ajax.php";
let data_param = [{data : 3},{data : 1},{data : 2}];
ajaxs.each(url,data_param, function (resp,i) {
console.log(resp,i);
});