等待AJAX​​调用(POST)完成

Question

我正在使用jQuery UI选项卡,其中每个选项卡上都有不同的表单.在用户输入各种数据后,他们提交整个选项卡集,以便每个选项卡异步发布到服务器.这很好用,我在这里没有问题.

但是,遇到问题的是,我发布的最后一个表单必须在所有其他帖子完成之后发生.一般的想法是这样的:

postForm(0, "#Form1");
postForm(1, "#Form2");
postForm(2, "#Form3");
postForm(3, "#Form4");
$.post('Project/SaveProject', function (data) {
    $('<div class="save-alert">The current project has been saved.</div>')
    .insertAfter($('#tabs'))
    .fadeIn('slow')
    .animate({ opacity: 1.0 }, 3000)
    .fadeOut('slow', function () {
        $(this).remove();
    });
});

postForm函数进行一些处理,然后进行AJAX $ .post调用.这里执行的最后一个$ .post(到'Project/SaveProject')必须等到其他帖子完成.这样做的最佳方法是什么？

Answer 1

您可以使用.ajaxStop()在所有其他AJAX POST完成时触发的事件,假设您没有执行其他AJAX工作,如下所示:

postForm(0, "#Form1");
postForm(1, "#Form2");
postForm(2, "#Form3");
postForm(3, "#Form4");
$(document).ajaxStop(function() {
  $.post('Project/SaveProject', function (data) {
    $('<div class="save-alert">The current project has been saved.</div>')
    .insertAfter($('#tabs'))
    .fadeIn('slow')
    .animate({ opacity: 1.0 }, 3000)
    .fadeOut('slow', function () {
      $(this).remove();
    });
  });
  $(this).unbind('ajaxStop');
});

.ajaxStop()火灾时,所有正在运行的完整的AJAX请求,所以它只会在火灾所有那些帖子已经返回,jQuery的内部保持一个计数($.active,$.ajax.activejQuery的1.5),以determind同时AJAX请求有多少优秀的...当它得到回到0这个事件开火了.

这种方法允许您同时执行其他表单提交,并在之后尽快完成最终表单.

Answer 2

您总是可以使用类似的方式使所有帖子同步

$.ajax({
   type: "POST",     
   async: false,
   url: "",
   ...

当然它不会那么快但如果$(document).ajaxStop不是一个选项,它确实解决了你的问题