Ajax onreadystatechange函数readyState

Question

我在我的页面上有一个脚本，它从Flickr接收回图像的原始JSON数据。我想使用readyState来提供正在发生的实时反馈。

我当前的代码所能做的就是检查readyState是否为4，状态是否为200。如果是这样，它会将原始JSON数据添加到页面。

代码：

function sendRequest (request) {

   //Request is the URL string to flickr containings tags entered by the user.

    x = new XMLHttpRequest();
    x.open("GET", request,false);
    x.send(null);



                if (x.readyState==4 && x.status==200)
                {
                document.getElementById("resultsContainer").innerHTML="Raw JSON Data: <br>"+x.responseText+"<br><br>";
                } 


}

正如您所看到的，它将接收到的值添加回resultsContainer目录。我尝试在同一个div中添加反馈，如下所示：

if(x.readyState==3){
document.getElementById("resultsContainer").innerHTML="Processing Request";
}

但它没有任何效果。我想知道为什么它能成功识别就绪状态4，而不是3？

我知道有一个onreadystatechange函数，并试图使用它，但它从未执行过任何代码，即不起作用。

如何在请求发生时执行操作(readyState == 3)？

编辑：

CURRENT CODE:

function sendRequest (request) {

    x = new XMLHttpRequest();
    x.open("GET", request,true);
    x.send();

    x.onreadystatechange = function () {

        if (x.readyState==4 && x.status==200){
            document.getElementById("resultsContainer").innerHTML="success <br>"+x.responseText;
        } 

        if(x.readyState==3){
            document.getElementById("getIms").value="Processing";
        }

    }



}

元素getIms的值只有在返回该值并将其添加到结果容器中时才会更改为processing。

Answer 1

您应该将代码更改为

x.open("GET", request, true);
x.onreadystatechange = function()
{
    //Your code here to handle readyState==4 and readyState==3
    if (x.readyState==4 && x.status==200)
    {
        document.getElementById("resultsContainer").innerHTML="Raw JSON Data: <br>"+x.responseText+"<br><br>";
    }
    else if (x.readyState==2)
    {
        document.getElementById("resultsContainer").innerHTML="Processing Request";
    }
}
x.send();

这是因为x.open中的'false‘关键字声明它应该同步工作，即:它发送请求，然后等待，直到您的浏览器获得响应(readyState == 4)，然后它运行其余的代码。

更改说明x.open必须是异步的，您还必须创建一个事件处理程序，该函数将在每次readyState更改时执行。

您应该将在处理请求时应该执行的代码放在else-语句中。它不在readyState=3上做任何事情的原因是因为readyState=3意味着已经接收了一部分数据，但是如果数据量非常小，这种状态将在非常有限的时间内为真。当您的请求已发送时，ReadyState=2为true。