Ajax显示数据时，如何在现实过程中显示正在加载数据，请等待的样式

Question

我是这么做的，也是不行，不显示加载信息，直接显示结果//脚本部分
<script>
function ShowData()
{
       loading.style.display=  "  ";//显示层  
       var  a=false;  
       a=DataItem.Test();//ajax加载数据，加载完成后显示true  
       if(a.value==true)  
       {  
               loading.style.display=  "none  ";//隐藏层  
       } 
}
</script>
//html部分
<div id="loadding" style="display:none">正在加载数据，请等待</div>
<input type="button" onclick="ShowData();"></input>

Answer 1

汗，以前作的这个是异步回调实现的
 function showMessage( id, context )
      {
        context.parentElement.parentElement.className = "message_read";
        context.className = "box02";
        context.innerHTML += "<div style=\"color: #DD2200;\">正在读取消息...</div>";
        context.onclick = null;
        context.style.cursor = "auto";
        
        <%=ClientScript.GetCallbackEventReference( this, "\"s\"+id", "showMessageCallback", "context" ) %>
      }
      
      function showMessageCallback( message, context )
      {
        context.innerText = message;
      }
context是一个div

Answer 2

以下为测试方法：
 //运行第一次，使该层显示，运行第二次，执行ajax并使该层隐藏，中间间隔3秒
 
var b=false;
function ustbwuyi()
{
 document.getElementById("loadding").style.display="";
 if(b=true)
 {
  //执行ajax  
  document.getElementById("loadding").style.display="none";
 }
 b=true;
}
window.setTimeout(ustbwuyi,3000);应用：

Answer 3

这个方法有用，谢谢，与大家分享
<script>
function SearchClick()
{
   loading.style.display="";//显示层  
   window.setTimeout(ShowData,3000);//调用显示方法
}
function ShowData()
{
       var  a=false;  
       a=DataItem.Test();//ajax加载数据，加载完成后显示true  
       if(a.value==true)  
       {  
               loading.style.display="none";//隐藏层  
       } 
}
</script>
//html部分
<div id="loadding" style="display:none">正在加载数据，请等待</div>
<input type="button" onclick="SearchClick();"></input>

Answer 4

对，用setTimeout方法延时执行下一个函数