0

私の問題: 特定の DIV にいくつかのコンテンツをロードするこの AJAX 呼び出しが Web サイト内にあります。このコンテンツのロード中に、AJAX が要求されたコンテンツを返すまで、GIF ロード アニメーションが (JavaScript を介して) 挿入されます。

FF は JavaScript を線形の順序でロードするため、これは Firefox 内で完全に正常に動作します。一方、Chrome と IE はそのゲームをプレイしていないようです。最初にすべての AJAX を起動してから、他のすべてを処理しているようです。

知っておくと便利: 私の AJAX 呼び出しの非同期は FALSE です。はい、私は TRUE 非同期の使用を目指す必要がありますが、この場合はそのようにする必要があります。

私の目標: AJAX の読み込み中は何もできないことがわかっているので、AJAX が呼び出される前にアニメーションを挿入するコード行を実行したいと思います。setTimeout() を試しましたが、スクリプト全体が壊れてしまいます。

助言がありますか?

コードは次のとおりです。

<div id="mycolumn">
    <!-- Here: Loading Animation first, then AJAX responseText -->
</div>

JavaScript 関数:

function myAjaxCall () {

    // Initiate HTTP Request
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
     } else {
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
     }

    // I want this to happen BEFORE any AJAX gets executed    
    document.getElementById("mycolumn").innerHTML="<img src='loading.gif'>"; 

    // AJAX Request, gets fired by Chrome and IE before anything else, 
    // wich prevents my img from being inserted before the response arrives
    xmlhttp.open("GET","someURL",false);
    xmlhttp.send(null);

    // AJAX Response, replaces my Loading Animation
    document.getElementById("mycolumn").innerHTML=xmlhttp.responseText;
}
4

0 に答える 0