ajax 暂停,暂停函数执行流程直到ajax请求完成

我似乎遇到了典型的“异步问题”，解决方案就是我。

我有一个bootstrap form wizard，这只是一个即兴的标签/幻灯片有点儿的东西。我的所有“步骤”都是各自标签/幻灯片中的表格。

它有一组下一个/上一个按钮来浏览幻灯片。

并且在之前提供功能回调转移到下一张幻灯片。

在其中(回调)我是“客户端验证”当前幻灯片中的表单，如果已经验证，那么我将使用ajax提交表单。一旦我从服务器得到响应，我决定是否返回true(继续下一张幻灯片)或返回false(停止导航到下一张幻灯片)。

我已经调查过了..

Using callbacks但是它不会阻止插件进入下一张幻灯片，btw是硬编码的成功消息，所以当我们等待ajax响应时，向导已经移动到下一张幻灯片。 / LI>

使用async:false但这会让浏览器像疯了一样(按设计)挂起，直到请求完成，所以没有挂起这就是我想要的。

我的代码如下。

JS。

jQuery('#progressWizard').bootstrapWizard({

'nextSelector': '.next',

'previousSelector': '.previous',

onNext: function (tab, navigation, index) {

if (index == 1) { // Here I am deciding which code to execute based on the current slide/tab (index)

if (jQuery("#paymentstep1").data('bValidator').validate()) {

var data = new FormData(jQuery('#paymentstep1')[0]);

jQuery("#cgloader").fadeIn();

var success = false;

jQuery.ajax({

type: "post",

async: false,

contentType: false,

processData: false,

url: "xyz.php",

dataType: "json",

data: data,

success: function (r) {

return r;

}

});

}....