按顺序进行jQuery ajax调用

我希望以这种方式进行一堆Ajax调用：call（n）在call（n-1）完成后启动…

我不能使用async：false有很多原因：

• 一些请求可能是jsonp （最相关的）
• 我有其他可能同时工作的ajax请求..
• 浏览器被阻止了

我无法用这种方式链接我的请求：

$.post('server.php', {param:'param1'}, function(data){ //process data $.post('server.php', {param:'param2'}, function(data){ //process data }); }); 

因为请求的数量和参数是从用户输入动态创建的。

一个小例子说明了我的问题。

您将看到服务器响应顺序是随机的，我想要实现的是按顺序

 Response to arg1 Response to arg2 Response to arg3 Response to arg4 Response to arg5 Response to arg6 

任何帮助将非常感谢，谢谢。

Answer 1

好的，jQuery Ajax返回一个Deferred Object ，这可以帮助你实现这一目标。

这是怎么做的：

 var args = ['arg1','arg2','arg3','arg4','arg5','arg6']; deferredPost(0, 5); function deferredPost(index, max){ var delay = Math.random()*3; if (index'); }).then(function(){ deferredPost(index+1, max); }); } else { return $.post('/echo/html/', {html:('Response to '+args[index]), delay:delay}, function(data){ $('#response').append(data+'
'); }); } } 

DEMO

在这里我用了函数。

我还建议您阅读更多有关延迟对象的内容，它们可以解决一些常见问题。

Answer 2

这是队列的工作。

 var queue = ['arg1','arg2','arg3','arg4','arg5','arg6']; function runQueueInOrder() { if (queue.length === 0) { return; } var arg = queue.pop(); var delay = Math.random()*3; $.post('/echo/html/', {html:('Response to '+ arg), delay:delay}, function(data){ $('#response').append(data+'
'); }).then(function() { runQueueInOrder(); }); } runQueueInOrder(); 

如果你已经在函数中封装了队列的处理，那么你就不需要使用jQuery了。 这很方便。 代码是破坏性的，因为它从原始数组中删除元素（但是当它们被处理时，它通常是正常的）。

调用runQueueInOrder方法以启动处理。

当没有更多工作要做时，该function就会退出。 （我之前写的是一个定时器轮询的版本，但这里不需要）。

该函数抓取下一个工作arg ，调用你的post调用语法，完成时使用jQuery的延迟然后回调再次调用该函数（如果需要，进一步处理队列）。

（我查看了另一个答案，发现它很容易跟随，因此我采用了一种更简单的方法。使用我的简单版本，您可以在发现新作品时添加新项目 – 或删除它们。）。