javascript Ajax onreadystatechange 函数 readyState
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23315288/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Ajax onreadystatechange function readyState
提问by Anon Omus
I have a script on my page that receives raw JSON data for an image back from Flickr. I want to use readyState to provide live feedback as it's taking place.
我的页面上有一个脚本，用于从 Flickr 接收图像的原始 JSON 数据。我想使用 readyState 在它发生时提供实时反馈。
What my current code is able to do is check that the readyState is 4 and the status is 200. When this is true it adds the raw JSON data to the page.
我当前的代码能够做的是检查 readyState 是否为 4，状态是否为 200。如果为真，它会将原始 JSON 数据添加到页面。
Code:
代码：
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>";
}
}
As you can see it adds the value received back to the resultsContainer div. I tried to add feedback in the same div like this:
如您所见，它将接收到的值添加回 resultsContainer div。我尝试在同一个 div 中添加反馈，如下所示：
if(x.readyState==3){
document.getElementById("resultsContainer").innerHTML="Processing Request";
}
But it has no effect. I am wondering why it successfully recognises the ready state 4, but not three?
但它没有效果。我想知道为什么它成功识别了就绪状态 4，而不是 3？
I understand there is an onreadystatechange function and tried to use it but it never executed any of the code, i.e didn't work.
我知道有一个 onreadystatechange 函数并尝试使用它，但它从未执行过任何代码，即没有工作。
How can I perform an action while the request is happening (readyState == 3) ?
如何在请求发生时执行操作 (readyState == 3)？
EDIT:
编辑：
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";
}
}
}
The element getIms' value changes to processing only when the value is returned and added to the results container.
仅当返回值并添加到结果容器时，元素 getIms 的值才会更改为处理。
回答by Seeseemelk
You should change your code to
您应该将代码更改为
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();
This is because the 'false' keyword in x.open states that it should work synchronous, that is: it send the request, then waits until your browser gets a response (readyState == 4) and then it runs the rest of the code.
这是因为 x.open 中的 'false' 关键字声明它应该同步工作，即：发送请求，然后等待浏览器收到响应（readyState == 4），然后运行其余代码.
The change says that x.open must be asynchronous and you also have to create an event handler, it's a function that will be executed every time readyState changes.
更改表示 x.open 必须是异步的，您还必须创建一个事件处理程序，它是一个每次 readyState 更改时都会执行的函数。
You should place the code that should be executed whilst the request is being processed in an else-statement. The reason it isn't doing anything on readyState=3 is because readyState=3 means that a part of the data has already been received, but if the amount of data is very small, this state will be true for a very limited amount of time. ReadyState=2 is true at the moment that your request has been send.
您应该将在处理请求时应该执行的代码放在 else 语句中。之所以没有在readyState=3上做任何事情，是因为readyState=3表示已经收到了一部分数据，但是如果数据量非常少，这个状态会在非常有限的时间内为真时间。ReadyState=2 在您的请求已发送时为真。
