Javascript 可以调用多个AJAX调用，也可以不调用，然后执行函数

我正在使用C#和jQuery构建表单页面，我有多个输入，如果它们被填充，我想向附加的SQL Server提交一个AJAX调用，如果它们没有被填充，我什么都不想做。 一旦所有填充的页面都完成了AJAX调用，那么我想重新加载页面

现在我有一个这样的函数：

Func1()
{
   if ($'#form1').val().length > 0 {
   $.post('https://foo/', {id: id, column: col1, value: $('form1').val())
   }

   if ($'#form2').val().length > 0 {
   $.post('https://foo/', {id: id, column: col1, value: $('form2').val())
   }
}

$('#submit').click(function() {
  Func1();
  window.location.reload(true);
} );

---

然而，这会导致一些值被更新，但不是全部，我知道这与我的异步调用有关。我对异步调用相当陌生，但通常我会放一个.then（function（）{}）；在它们的末端，它们工作得很好，但在这种情况下，它不能修复任何问题。有人能给我指出解决这个问题的正确资源方向吗？我无法嵌套我的AJAX调用，因为有时2会被更新，而1不会被更新。

我可以想出一个解决方案。也许有更好的解决办法

1） 用false声明两个布尔变量

2） 一旦特定调用成功/失败，将每个变量设置为true

3） 将“窗口重新加载”移动到“文档准备就绪”，并相应地重新加载

$(document).ready(function(){     
  if (callOne == true && calltwo == true){
 window.location.reload(true);
 }    
}

---

看一看这个优雅的房间

使用上述方法，可以将代码重写为：

$('#submit').click(function() {
   if (($'#form1').val().length > 0 && ($'#form2').val().length > 0) {
       $.when($.post(*form1Call*), $.post(*form2Call*)).done(
              function(a1, a2){
                   // your code to process the results from both ajax posts
                   // ..
                   window.location.reload(true);
              }
       )
   }      
 });

---

根据您的需求，您可以通过对代码进行较小的重新整理来实现：

  function form1CallAsync(){
      var d = $.Deferred();
      if ($'#form1').val().length > 0) {
       // Ajax call for Form1 post. Important: In the success callback, have    
       //d.resolve() in the end, in the error callback, d.reject()
      } else { d.resolve(); }
      return d.promise();
    }
    function form2CallAsync(){
      var d = $.Deferred();
      if ($'#form2').val().length > 0) {
       // Ajax call for Form2 post. Important: In the success callback, have    
       //d.resolve() in the end, in the error callback, d.reject()
      } else { d.resolve(); }
      return d.promise();
    }
    $('#submit').click(function() {   
           $.when(form1CallAsync(), form2CallAsync()).done(
                  function(a1, a2){
                       // your code to process the results from both ajax posts
                       // ..
                       window.location.reload(true);
                  }
           )
     });

---

为什么要贴“C#”和“razor”标签？我猜你在项目中使用了它们，但它们似乎与问题无关。无论如何，如果您想在所有Ajax调用完成后重新加载页面，您可以使用

Promise.all（）

等待它们。@nnnnnn是的，我在我的项目中同时使用它们。抱歉，如果它们不相关，我不确定。你能给我更多关于如何使用Promise.all（）的上下文吗？是的，这是因为ajax是异步的，你在ajax调用完成之前调用

location.reload（）

。但是ajax的全部目的是保持在同一页面上，并使用

location.reload（）

在ajax调用完全没有意义（并且会降低性能）之后添加一些信息，除非我有误解，否则这不会解决我的问题，如果填写了form2，而form1没有填写，它将永远不会提交form2的更新。这很完美，谢谢我将尝试一下，然后将其标记为有效答案。这非常有效，您只需使用构造函数括号在.$when之后调用函数。您还需要在每个函数的else语句中解析deferred