Question

我写了以下简单的javascript代码

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head> <title>ajax</title> </head>
    <body>
    <script type="text/javascript">
            var xhr = new XMLHttpRequest();
            var url = "http://localhost/javascript/test.php";
            xhr.open("GET", url);
            alert(xhr);
            xhr.send(null);
            xhr.onreadystatechange = function () {alert("change");}
            alert(xhr.responseText);
    </script>
    </body>
    </html>

结果显示xhr.responseText为空。但是以下javascript代码工作正常。为什么呢？

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head><title>ajax</title></head>
    <body>
    <script type="text/javascript">
            var xhr = new XMLHttpRequest();
            var url = "http://localhost/javascript/test.php";
            xhr.open("GET", url);
            xhr.send(null);
            xhr.onreadystatechange = 
            function () { 
                 if (xhr.readyState == 4) alert(xhr.responseText); 
            };
    </script>
    </body>

    </html>

以下是简单的PHP代码：test.php

    <?php
    echo date("F j, Y, H:i:s");

Answer 1

当答案来自服务器时，浏览器将触发对象的onreadystatechanged事件，导致你附加到它的功能被触发，你在第一个例子中需要做的就是这一行：

alert(xhr.responseText);

您附加到onreadystatechanged事件的函数内部。否则浏览器将在发送请求后立即处理该行。
此外，您必须检查readystate是否为4（4：请求已完成并且响应已准备就绪），并且还值得检查状态是否为200，这意味着一切正常。

Answer 2

与r0nny的答案类似，您的第一个示例在返回您的ajax之前得到处理。使用onreadystatechange等待ajax响应，然后执行您需要的操作。

什么时候XmlHttp Response.responseText会被服务器的响应填充？

2 个答案: