javascript - 如何等到异步步骤完成？

Question

我有一个表单，需要在提交之前运行一些验证操作。这些操作涉及异步步骤，例如 ajax 调用。

如何让表单等待所有验证操作完成后再提交？

我的验证函数如下所示(伪代码):

function preSubmit() {
    // validate field 1
    ajax({
        ...
        onSuccess:...
    });
    // validate field 2
    ajax({
        ...
        onSuccess:...
    });
    // fields 3, 4, etc.
}

我当前的问题是在 onSuccess 回调完成之前提交了表单。

我当然可以使我的 ajax 调用同步，但由于性能影响，我正试图避免它。

Answer 1

如果您正在使用 jQuery，那么您可能需要考虑 JQuery.Deferred 或 Promise

当前一个调用完成(成功或失败)时，您调用每个 ajax 请求(或包含该请求的函数)。

如果你使用 $.when 你可以通过 .then 回调来管理失败的请求。如果您使用 promises，那么您可以在各种场景中使用 .done .fail 和 .always 回调。

$.when($.ajax("...."), $.ajax("...."))
  .then(...);

资源:

• http://joseoncode.com/2011/09/26/a-walkthrough-jquery-deferred-and-promise/
• http://api.jquery.com/jQuery.when/
• http://api.jquery.com/promise/