<script language="javascript" type="text/javascript">
    document.write(" <div id='loadDiv' style=''> <span id='loading' style='position:absolute;top:20px;left:20px;font-size:12px;'> <img src=\"Images/loading.gif\"/>正在加载数据,请稍候··· </span> </div>");
    window.onload = function() {
    document.getElementById("loadDiv").style.display = "none";
        document.getElementById("hiddenDiv").style.display = "block";
     
        //document.getElementById("loadDiv").parentNode.removeChild(document.getElementById("loadDiv"));    } 
    </script> 
这个是加载完才显示,能不能弄一个加载中显示,加载后消失的demo

解决方案 »

  1.   

    加载中显示,加载后消失的demo ?
      

  2.   

    window.onload = function() 应该是这里确定了开始加载的时候用,
      

  3.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script>
            function ifrLoad() {
                document.getElementById('divBusy').style.display = "none";
                document.getElementById('divContent').style.display = "";
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div id="divBusy"><span id='loading' style='position:absolute;top:20px;left:20px;font-size:12px;'> <img src=\"Images/loading.gif\"/>正在加载数据,请稍候··· </span></div>
        <div id="divContent" style="display:none" >
        <iframe id="iframe"></iframe>
        </div>
        <script defer="defer" >
            document.getElementById('iframe').src = "Default2.aspx";
            document.getElementById('iframe').onload = ifrLoad;
        </script>
        </form>
    </body>
    </html>
      

  4.   


    Default2.aspx.cs
    protected void Page_Load(object sender, EventArgs e)
        {
            System.Threading.Thread.Sleep(5000);
            Response.Write("Hello");
            Response.End();
           
        }
      

  5.   

    http://www.cnblogs.com/Fernando/archive/2007/12/19/1005702.html
      

  6.   

    在page_load的时候创建一个div,然后判断页面的加载装载状态,完成后消失.protected void Page_Load(object sender, EventArgs e)
        {
            Loading();
        } 
     public void Loading()
        {
            HttpContext hc = HttpContext.Current;
            //创建一个页面居中的div
            hc.Response.Write("<div id='loading'style='position: absolute; height: 100px; text-align: center;z-index: 9999; left: 50%; top: 50%; margin-top: -50px; margin-left: -175px;'> ");
            hc.Response.Write("<br />页面正在加载中,请稍候<br /><br /> ");
            hc.Response.Write("<table border='0' cellpadding='0' cellspacing='0' style='background-image: url(images/Progress/plan-bg.gif);text-align: center; width: 300px;'> ");
            hc.Response.Write("<tr><td style='height: 20px; text-align: center'><marquee direction='right' scrollamount='30' width='290px'> <img height='10' src='images/Progress/plan-wait.gif' width='270' />");
            hc.Response.Write("</marquee></td></tr></table></div>");
            //hc.Response.Write("<script>mydiv.innerText = '';</script>");
            hc.Response.Write("<script type=text/javascript>");
            //最重要是这句了,重写文档的onreadystatechange事件,判断文档是否加载完毕
            hc.Response.Write("function document.onreadystatechange()");
            hc.Response.Write(@"{ try  
                                       {
                                        if (document.readyState == 'complete') 
                                        {
                                             delNode('loading');
                                            
                                        }
                                       }
                                     catch(e)
                                        {
                                            alert('页面加载失败');
                                        }
                                                            }                             function delNode(nodeId)
                                {   
                                    try
                                    {   
                                          var div =document.getElementById(nodeId); 
                                          if(div !==null)
                                          {
                                              div.parentNode.removeChild(div);   
                                              div=null;    
                                              CollectGarbage(); 
                                          } 
                                    }
                                    catch(e)
                                    {   
                                       alert('删除ID为'+nodeId+'的节点出现异常');
                                    }   
                                }                            ");        hc.Response.Write("</script>");
            hc.Response.Flush();
        }
      

  7.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>无标题页</title>
        <script src="jquery-1.2.6.min.js"></script>
        <script>
        function ajaxGet()
        {
            $.get("GetSessionHandler.ashx",{date:new Date()},
                    function(data){                
                        var num=parseInt(data);                                        
                        if((!isNaN(num))&&(num<100))
                        {
                            $("#result").text(num+"%");
                            window.setTimeout(ajaxGet, 1000);
                        }
                        else if((!isNaN(num))&&(num==100))
                        {
                            $("#result").text("100%");
                            window.setTimeout('$("#result").text("发送已完成");', 2000);                        
                        }
                    }
                );
        }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:Button ID="btn" runat="server" Text="上传" OnClick="btn_Click" />
        <div id="result"></div>        
        </form>
    </body>
    </html>
    protected void btn_Click(object sender, EventArgs e)
        {
            Session["a"] = "0"; 
            System.Threading.Thread NewTh = new System.Threading.Thread(new System.Threading.ThreadStart(Update)); 
                  
            NewTh.Start();
            ClientScript.RegisterStartupScript(this.GetType(), "ajaxGet", "ajaxGet();", true); 
        }    void Update() 
        {         try 
            { 
                //模拟邮件发送
                Session["a"] = "10"; 
                System.Threading.Thread.Sleep(3000);
                Session["a"] = "30"; 
                System.Threading.Thread.Sleep(3000);
                Session["a"] = "50"; 
                System.Threading.Thread.Sleep(3000);
                Session["a"] = "80"; 
                System.Threading.Thread.Sleep(3000);
                Session["a"] = "100"; 
                System.Threading.Thread.Sleep(3000); 
              
            } 
            catch (Exception ee)
            {
                String exceptionStr = ee.StackTrace;
            } 
        } 
    <%@ WebHandler Language="C#" Class="GetSessionHandler" %>using System;
    using System.Web;public class GetSessionHandler : IHttpHandler, System.Web.SessionState.IRequiresSessionState
    {
        
        public void ProcessRequest (HttpContext context) {
            context.Response.ContentType = "text/plain";
            String tempStr = context.Session["a"] != null ? context.Session["a"].ToString() : "-1";
            context.Response.Write(tempStr);                
        }
     
        public bool IsReusable {
            get {
                return false;
            }
        }}
      

  8.   

    你需要的应该就是这个 ajax + 多线程