AJAX 在没有警报框的情况下无法工作 [重复]

Question

我正在尝试使用此代码：

$('#form1').on('submit', function(){
    var txtItemCode = $('#txtItemCode').val();
    $.post("userExist.php", {
        txtItemCode: txtItemCode,
    }, function(data,status){
        //alert("Data: " + data + "\nStatus: " + status);
        $('#status').html(data);    
        reply = data;
        //alert(reply);
    });
    alert('');
    if (reply=='OK'){
        return false;
    }
});

我需要检查data=="OK" 是否返回false，但是当我删除alert 时，它不再起作用。为什么会这样，我怎样才能让它发挥作用？

Answer 1

在您引入警报时它起作用的原因是因为它会停止执行并为异步调用提供足够的时间来完成。

您没有得到正确的值，因为在发布请求完成并执行回调时，您的 javascript 已经完成执行。

你有几个选择：

1. 声明一个全局变量并执行同步调用，您可以使用发布的代码 ABC 或在 POST 调用之前调用 $.ajaxSetup({ async: false })。将返回值分配给全局变量并对其进行验证。
2. 使用jQuery的ajaxStop：$(document).ajaxStop(function() { //check your values here, still need to declare a global });
3. 将值写入隐藏的 div/作为 DOM 中任何位置的属性，并有一个计时器定期检查它，直到有值为止。

Answer 2

在您的代码中，ajax 调用是异步工作的，因此无论您是否得到响应，您的下一行都将被执行。在同步调用之前，您的下一行将不会被执行，直到您得到响应。 您可以从 $.post 变成 $.ajax 并使异步属性为 false。然后就可以get，然后ajax调用响应后就可以得到"reply"的值了。

$.ajax({
  type: 'POST',
  url: url,
  data: data,
  success: success,
  dataType: dataType,
  async:false
});

Answer 3

我想到了一个新想法，请检查一下。

/**
 * form submit
 */
$('#form1').on('submit', function() {
    if (checkExistence()) {
        return false;
    }
});

/**
 * check existence in db
 * @returns {Boolean}
 */
function checkExistence() {
    var txtItemCode = $('#txtItemCode').val();
    var result = true;
    $.post("http://localhost/test.php", {
        txtItemCode: txtItemCode,
    }, function(data, status) {
        //alert("Data: " + data + "\nStatus: " + status);

        if (data == 'OK') {
            $('#status').html(data);
            result = true;
        } else {
            $('#txtItemCode').val('').focus();
            $('#status').html("Code is already existing, please provide another one:)")
            result = false;
        }
    });

    return result;
}

注意：你可以交换结果的值并检查。