我使用的是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”)必须等到这些其他帖子完成.什么是最好的方式去做这个?
解决方法
您可以使用所有其他AJAX POST完成时触发的
.ajaxStop()事件,假设您没有执行其他AJAX工作,如下所示:
postForm(0,"#Form4");
$(document).ajaxStop(function() {
$.post('Project/SaveProject',function () {
$(this).remove();
});
});
$(this).unbind('ajaxStop');
});
当所有AJAX请求都运行完毕时,.ajaxStop()将触发,因此只有当所有这些POST都返回时才会触发jQuery在内部保持一个计数(jQuery 1.5中的$.active,$.ajax.active)来确定多少个同时的AJAX请求是非常好的…当它回到0这个事件触发.
这种方法可以让您同时进行其他表单提交,并且尽快完成最终的表单.