Question

可能重复：
How do you make javascript code execute *in order*

var cek = false;

function checkForm()
{
    var user = document.forms["LoginForm"]["user"].value;
    var pwd = document.forms["LoginForm"]["pwd"].value;
    AJAXfunc("checkidpass.php?id="+user+"&pass="+pwd,function()
    {
        if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200))
        {
            $("#LoginRes").html(xmlhttp.responseText);
            if (xmlhttp.responseText == "")
                cek = true;
        }
    }); //---> 1

    return cek; //---> 2
}

我想问为什么“返回cek;” （第2部分）在AJAXfunc（第1部分）之前执行？我想知道如何以正确的顺序执行它。

感谢您的帮助！

Answer 1

要了解您的问题，您需要了解异步方法。一个简单的谷歌将为您提供大量的阅读材料。我建议从这里开始：

Mastering Ajax, Part 2: Make asynchronous requests with JavaScript and Ajax

提示：您现在正在做的事情从不工作 - 除非您选择将其作为同步功能（不推荐）。

Answer 2

那是因为AJAX调用是异步的。

AJAXfunc调用在return语句之前执行，但您在AJAXfunc调用中提供的匿名函数稍后会被调用。

在return语句之前运行回调的方法是使AJAX调用同步。然而，这通常不是一个好主意，因为这会使浏览器在等待响应时冻结。

处理此问题的常用方法是在checkForm函数中使用回调：

function checkForm(callback) {
  var user = document.forms["LoginForm"]["user"].value;
  var pwd = document.forms["LoginForm"]["pwd"].value;
  AJAXfunc("checkidpass.php?id="+user+"&pass="+pwd,function() {
    if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200)) {
      $("#LoginRes").html(xmlhttp.responseText);
      callback(xmlhttp.responseText == "");
    }
  });
}

用法：

checkForm(function(cek) {
  if (cek) {
    // ok
  } else {
    // not ok
  }
});

Answer 3

Javascript是异步的，因此像你AJAXfunc这样的异步函数在完成之前不会阻止你的程序。这就是javascript中大量使用事件和回调的原因。

e.g。你的回调代码看起来像：

function checkForm(callback)
{
    var user = document.forms["LoginForm"]["user"].value;
    var pwd = document.forms["LoginForm"]["pwd"].value;
    AJAXfunc("checkidpass.php?id="+user+"&pass="+pwd,function()
    {
        if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200))
        {
            $("#LoginRes").html(xmlhttp.responseText);
            if (xmlhttp.responseText == "")
                return callback(true);
        }
        return callback(false);
    }); 
}

checkForm( function (result) { 
    var cek = result;
    // Rest of your code for manipulating DOM or something else where you need cek.
} );

Answer 4

您最好重新构建代码，以便在收到回复时触发回调。

即。 1.使checkForm有一个回调参数 2.使用结果激活该回调 3.在回调中使用其余代码而不是返回函数

例如：

// before (wrong):
result = checkForm();
handleResult1(result);
handleResult2(result);

// after (correct):
checkForm(function(result) {
    handleResult1(result);
    handleResult2(result);
}

我的javascript代码没有按正确的顺序执行

4 个答案: