javascript - 在提交表单之前等待异步 .ajaxComplete()

Question

我需要覆盖表单的提交方法以等待 ajax 请求完成。同时，ajax 请求应该是异步的以显示进度指示器，并且默认的表单处理程序必须在收到响应后继续。

我不能使用 event.preventDefault() 然后手动调用 form.submit() ，因为表单发送结果应该在浏览器的新选项卡中打开。如果 form.submit() 将从代码中调用，那么某些浏览器（即 chrome）将阻止新的选项卡/窗口。

为清楚起见，伪代码：

$('#form').submit(function(e) {
  var result;
  startIndicator();
  asyncAjaxCheckResults();  // ajax complete handler changed 'result' var
  stopIndicator(); // stopping indicator after async ajax will be completed

  // continue with default submit behavior if we received desired result
  // else prevent executing 
  if (result !== 'desired result') {
    e.preventDefault();
  }
});

在这种情况下可以做些什么吗？也许 $.deferred 可以帮助或无限循环？

Answer 1

我认为您需要同步 ajax 调用，因此脚本将等待响应然后继续运行。

$.ajax({

...

异步：假，

...

});

http://api.jquery.com/jQuery.ajax/

Answer 2

另一种方法是将点击事件添加到提交按钮，而不是将事件提交到表单，发送 ajax 并使用 event.prevenrDefault，在 ajax 成功回调时触发表单提交 - $('#form').submit()。