1

私のページには、Flickr から返された画像の未加工の JSON データを受け取るスクリプトがあります。readyState を使用して、進行中のライブ フィードバックを提供したいと考えています。

私の現在のコードでできることは、readyState が 4 でステータスが 200 であることを確認することです。これが true の場合、生の 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 に追加されます。次のように、同じ 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 の値は、値が返されて結果コンテナーに追加された場合にのみ処理に変更されます。

4

1 に答える 1

3

コードを次のように変更する必要があります

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 です。

于 2014-04-26T19:12:09.070 に答える