1

Web サイトが AJAX サーバーと通信しているときに、画面の中央にポップアップを表示しようとしています。一部の操作には数秒かかるため、操作が行われていることをユーザーに視覚的に知らせたいと考えています。たとえば、私のサイトで音楽のプレイリストを作成できます。プレイリストが作成されているときに、サーバー上にプレイリストを作成していることを示す div がポップアップするようにします。

これを作成するために使用している関数を示すためにjsfiddleを作成しましたが、少し逆の効果があります。フィドルでは、サーバーとの通信を試みた後にポップアップが表示されます (ドメイン外のものはすべて拒否するため、サーバーとの通信に失敗します) が、サーバーとの通信に失敗するため、hide_popup().

私のサーバーでは、ポップアップを表示することさえありません（呼び出しのalert()直後に呼び出す場合を除きshow_popup()ます）。

なぜこれが起こるのか分かりませんが、私は単純に
1. ポップアップを表示します
2. AJAX 呼び出しを実行します
3. ポップアップを非表示にします

助言がありますか？

4

2 に答える 2

1

コードの書き方にはいくつかの問題があります。それらのいくつかを次に示します。

(1.)電話:

var response = get_server_response("action=createPlaylist&name=" + name, false);

AJAX 呼び出しでは発生しない応答がすぐに返されることを期待しています。さらに、パラメーターを渡しfalseているため、効果的に呼び出しが行われています。これが、コードが他の処理を実行する前に待機する理由です。asyncsync

(2.)実装:

xmlhttp.onreadystatechange = function()
{
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
    {
        response = xmlhttp.responseText;
    }
}
xmlhttp.open("POST", ajax_server, async);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send(url);
return response;

結果をキャッシュするだけresponseで、追跡中は処理しませんonreadystatechange。あなたは実際には呼び出しの直後にそれを処理していますが、これは呼び出しの後に実行され、応答を受け取っていません。ここで応答を返す必要はありません。

(3.)ポップアップ:

適切な場所で表示/非表示を使用していません。

解決策:

onreadystatechange関数を実装して追跡中にコールバックを起動することをお勧めします。ネットワーク呼び出しを行う直前にポップアップを表示します。readyStateおよびに応じて、コールバック関数内に非表示にしますstatus。

これがあなたのための実用的なフィドルです：http://jsfiddle.net/nDNXc/549/

それが役立つことを願っています。

于 2013-09-17T14:22:04.410 に答える
0

まず、Ajax 呼び出しに共通のライブラリー ( jQuery.ajaxなど) を使用することをお勧めします。

次に、非同期 Javascript について学びます。get_server_response() の呼び出しは、Ajax リクエストが完了するのを待たずにすぐに返されます。jQuery.ajax の完全なパラメーターを見てください。リクエストが完了したときに呼び出される関数を受け入れます - メッセージを非表示にするのに適した場所です!

于 2013-09-17T14:21:52.130 に答える