Question

我知道我的问题是什么，我无法解决问题。

我有一个向导，基本上是一个5页的表格。在每个页面上，我进行了各种验证，如果验证匹配，则隐藏“页面”并显示下一页。

$('#wizard-2 .continue').click(function() {
  // Validation Here
  $('#wizard-2').hide();
  $('#wizard-3').show();
});

我的问题是其中一个验证函数需要ajax调用。

$.ajax({
  // Misc stuff
  success : function (bool) {
    if (bool == 0) {
      // Show Error
      return false;
    }
  }
});

我需要发生的是脚本等待ajax调用完成，如果success函数返回false，则需要停止脚本。

如果我使用的是真实表单，我会在成功函数中提交表单提交，并在ajax之后直接阻止默认操作。显然这不起作用，因为在完成向导的最后一页之前不应该提交表单。

有什么想法吗？

Answer 1

您可以尝试在.ajax调用中设置async: false以防止异步发生呼叫。当然，这会减慢您的页面速度，但这是一种选择。

另一种选择是在执行ajax调用的验证之后将这些内容放入您成功调用的函数中。不知道它是什么我不能勾勒出一个确切的选项，但肯定是

$('#wizard-2').hide();
$('#wizard-3').show();

将成为其中的一部分。

Answer 2

AJAX是异步的;你不能这样做。

^{从技术上讲，你可以，但它会冻结浏览器; 不}

您应该更改验证程序以进行回调，而不是返回bool：

function validate(callback){    
    $.ajax({
        success : function (bool) {
            if (bool == 0) {
                //Do soemthing
                callback(false);
            } else
                callback(true);
        }
    });
}

Answer 3

我会这样试试：

1）定义一个函数来执行验证，该函数还需要一个函数类型的参数用于回调。

2）在click事件中，使用应在成功事件上执行的函数调用验证函数。

类似的东西：

$('#wizard-2 .continue').click(function () {
    // Validation Here   
    processWizard(function(){
        $('#wizard-2').hide();
        $('#wizard-3').show();
    });

});

function processWizard(callback){
    $.ajax({   
        // Misc stuff   
        success : function (bool) {     
            if (bool == 0) {       
                // Show Error       
                return false;     
            }   
            else{
                callback();
            }
        } 
    }); 
}

Answer 4

你能把你的隐藏/显示代码放在回调函数中，以便成功调用AJAX吗？因此，只有在返回成功的情况下，它才会显示＆＃39;表格中的下一页。

本质上，AJAX是一个异步调用，因此在调用返回时发生某些事情的最佳方法是将其放入或从回调函数中调用它。

jQuery ajax成功触发问题

4 个答案: