我使用的是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这个事件触发.
这种方法可以让您同时进行其他表单提交,并且尽快完成最终的表单.