Question

我正在制作一个ajax请求，其中可能需要花费很多时间来处理server-end。所以我想在请求处理时显示加载图像。但是当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';
}

有什么不对吗？

我尝试调试并发现：

虽然在showLoadingImg()方法之前调用open()，但加载图片仅在ref.readyState==2之后显示在浏览器上。
但遗憾的是，readyState==2和readyState==4之间的时差非常小，加载图片会立即隐藏。
因此用户无法看到加载图像......

所以，我怀疑的是，除非转到readyState==2，否则ajax不会运行脚本。

Answer 1

如果您将async设置为false，就像在此处使用第三个参数一样设置ref.open('POST','x.jsp',false);时，> {/ 1>}。

Answer 2

我认为您对open的来电是错误的。第三个参数（布尔值）表示请求是否是异步的。

在此处考虑完整的文档：http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp

ref.open('POST','x.jsp',true);

应该解决你的问题。

此致

Ajax在处理请求时是否会阻止窗口？

2 个答案: