如何等待直到完成异步步骤？

我有一个表单，我需要在提交之前运行一些验证操作。这些操作涉及ajax调用等异步步骤。如何等待直到完成异步步骤？

如何告诉表单要等到所有验证操作在提交之前完成？

我的验证功能看起来是这样的（伪代码）：

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

我现在的问题是，在完成的onSuccess回调前的形式被提交。

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

来源

2013-02-20 Christophe

你使用jQuery吗？如果是这样，请查看'$ .when' – 2013-02-20 18:57:11

为什么不提交表单并让服务器告诉您它是否有效？ – 2013-02-20 18:57:47

@Kolink可以保存一次到服务器的旅程。在我的情况下，一些验证使用外部服务（例如地址）。 – Christophe 2013-02-20 19:13:15

如果你使用jQuery，那么你可能要考虑JQuery.Deferred or Promise

你打电话（包含请求或功能）每个Ajax请求，以前调用完成时（成功或失败）。

如果您使用$ .when，您可以通过.then回调管理失败的请求。如果您使用承诺，则可以在各种情况下使用.done.fail和.always回调。

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

资源：

来源

2013-02-20 19:13:06 dreboy

我忘记了我的问题中的一个关键约束（提交操作在preSubmit函数外部），并且在我知道所有答复都朝不同的方向前进之前。考虑到我提供的信息，我认为这是最合适的答案。 – Christophe 2013-02-20 20:53:30

最初创建一个“errorMsg”变量并将其设置为“waiting”，然后让您的aynchc代码更新它。

在您的表单提交代码中，检查该字段的值。这不是“准备好”，不要提交。

来源

2013-02-20 18:59:55

理想情况下，你应该只需要关闭一个ajax事件。如果您必须包含多个ajax事件，则可以使用成功回调函数按顺序（同步）触发异步请求。这是一个例子。

function preSubmit() { 
     $.ajax({ 
      error: handleError, 
      success: stepTwo 
     }); 
    } 
    function stepTwo() { 
     $.ajax({ 
      error: handleError, 
      success: stepThree 
     }); 
    }

来源

2013-02-20 19:02:01

这是有道理的，但正如我在问题中所说的那样，由于电话需要彼此等待，因此效率不高。 – Christophe 2013-02-20 19:05:19

拥有多个ajax调用本身并不“非常高效”。关于时间效率和假设你想验证的所有字段都是真的，那么是的，它可能会更快（几毫秒）。但是，考虑一个或多个字段无效的情况。即使第一个Ajax事件返回无效，您也会发起任何可能的Ajax事件。我和其他人可能会考虑浪费的服务器资源/带宽，而不仅仅是让用户等待几毫秒。 – 2013-02-20 19:20:47

Thx为commnent。这不是我现在设置的东西，但我需要重新考虑它。另外，我想通知用户有关所有验证问题，而不仅仅是返回无效状态。 – Christophe 2013-02-20 19:31:20

您可以使用JavaScript的设置超时功能。代码将如下所示，

function preSubmit() { 
//set a variable which increments after each Ajax call success. 
var successCount=0; 
// validate field 1 
ajax({ 
    ... 
    onSuccess: function(){ 
     successCount++; 
    } 
}); 
// validate field 2 
ajax({ 
    ... 
    onSuccess: function(){ 
     successCount++; 
    } 
}); 

    var wait = function(){ 
     setTimeout(function(){ 
     // check whether "successCount" is equal to number of validations done 
     //here it is 2 
     if(successCount==2){ 
     //call function say,"submitForm" which submit the form 
      submitForm(); 
     }else{ 
      //All validations are not completed, wait until it completes 
      wait(); 
     } 
     },1000); 
    } 
    wait(); 
}

这样您就可以有效地使用异步Ajax调用。

来源

2013-02-20 19:21:47

如何等待直到完成异步步骤？

回答

相关问题