2

我的jQuery 移动网站上有一个设置页面当用户单击保存按钮时,我为 3 种不同的用户输入更新服务器,即语言、货币、阈值

为了做到这一点,我进行了 3 个单独的 ajax 调用(使用 PUT)。因此,当一切都成功时,如果其中任何一个失败,我会转到另一个页面,我会留在同一页面上并显示错误消息。

问题是我只想在所有调用都成功的情况下切换页面,如果有任何错误我想显示一个包含所有消息的警报(而不是 3 个单独的警报窗口),所以我需要等待所有这些的结果来电。

为了在我使用的所有 3 个 Ajax 调用中实现这一点;

async:false 

我在所有这些调用成功方法中都添加了一个布尔值,例如;

     success: function (data){
           languageUpatesuccesful=true;

        }

然后是这样的;

 if(languageUpatesuccesful){
   make the next call to update currency..etc
}

...

if(allsuccesful(){
  changepage();
}

因此,我可以准确地跟踪一个呼叫何时结束,然后我会拨打下一个电话,如果所有成功切换到另一个页面。

虽然这可行,但我认为这是一个可怕的解决方案,有没有办法通过使用async:true来实现?

因为禁用异步 ajac 会冻结页面,我什至不能显示动画,jQuery 也不推荐这样做。但是,我怎么知道这 3 个电话何时完成并根据结果采取行动呢?

4

3 回答 3

8

延迟对象$.when

$.when(ajax1(), ajax2(), ajax3()).done(function() {
    // all Ajax calls successful, yay! 
}).fail(function() {
    // oh noes, at least one call failed!
});

其中ajaxX定义为:

function ajax1() {
    return $.ajax(...);
}

如果您确实想要链接 Ajax 调用而不是让它们并发,请查看Bergi 的解决方案

于 2013-01-29T15:57:32.817 回答
4

您可以使用 Deferred 接口轻松链接它们:

$.ajax({…})
  .then(function(languageUpateResult) {
     return $.ajax({…});
  })
  .then(function(currencyUpdateResult) {
     return $.ajax({…});
  })
  .then(function(thresholdUpdateResult) {
     changePage();
  });

抱歉,我跳过了 ajax 调用是分开的这一事实。上面的代码按顺序执行它们,如果您只想并行执行它们并等待它们全部完成使用$.when()- 请参阅@FelixKling 的答案

于 2013-01-29T15:56:56.953 回答
1

您可以尝试使用网络工作者在后台线程中进行异步调用。网络工作者有很好的浏览器支持,应该可以解决你的问题。如果你有兴趣,我已经写了一点 web worker 库的抽象来让它们更容易使用(只要给我发邮件)。

于 2013-01-29T15:57:18.507 回答