0

サーバー側の処理に時間がかかりそうな ajax リクエストを行っているので、リクエスト処理時に読み込み中の画像を表示したいのですが、ajax リクエスト中は読み込み中の画像が表示されません。

var ref = createAjaxRequest();//Ajax req is created here...
if(ref){
        showLoadingImg();
        ref.open('POST','x.jsp',false);
        ref.onreadystatechange = eventStateChange;
        ref.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        ref.setRequestHeader("Connection", "keep-alive");
        ref.send();
    }
    else{ alert("Your browser does not support this feature");
}
function eventStateChange(){
 if(ref.readyState==4 ){
    //processing response here......
   hideLoadingImg();
 }
}

function showLoadingImg();{
 /* <div id="ajaxLoading">(with background image is in page)
  It is displayed properly when I set display:inline 
  manually through developer tools of a browser.</div>
*/
  document.getElementById('ajaxLoading').style.display='inline';
}
function hideLoadingImg();{
  document.getElementById('ajaxLoading').style.display='none';
}

何か間違っていることでも？

デバッグしようとしたところ、次のことがわかりました。

  1. showLoadingImg()メソッドの前に呼び出されますがopen()、読み込み中の画像は の後にのみブラウザに表示されref.readyState==2ます。

  2. readyState==2しかし、残念ながらとの間の時間差readyState==4は非常に少なく、読み込み中の画像はすぐに非表示になります。
    したがって、ユーザーは読み込み中の画像を見ることができません...

だから、私が疑っているのは、スクリプトがreadyState==2.

4

2 に答える 2

2

ここで 3 番目の引数と同じように を設定asyncすると、 XMLHttpRequest がブロックされます。falseref.open('POST','x.jsp',false);

于 2013-10-04T14:57:20.250 に答える