asp.net 创建上传进度条

请问在asp.net 中Fileupload控件用来上传文件，但是我想做一个进度条，显示现在完成多少了，请问怎么实现啊，谢谢
最好给我一个c#的例子。

解决方案 »

  1.   

    <!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>
        <title>无标题页</title>    <script type="text/javascript">
        var xmlHttp;
        var key;
        function createXmlHttpRequest()
        {
            if(window.ActiveXObject)
                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            else if(window.XmlHttpRequest)
                xmlHttp=new XmlHttpRequest();
        }
        function go()
        {
            checkDiv();
            createXmlHttpRequest();
            xmlHttp.onreadystatechange=callback;
            xmlHttp.open("get","ProgressBar.aspx?task=create",true);
            xmlHttp.send(null);
        }
        function callback()
        {
            if(xmlHttp.readyState==4&&xmlHttp.status==200)
            {           
                setTimeout("pollServer()",1000);
            }
        }
        function pollServer()
        {
            createXmlHttpRequest();
            xmlHttp.onreadystatechange=pollCallback;
            xmlHttp.open("get","ProgressBar.aspx?task=poll&key="+key,true);
            xmlHttp.send(null);
        }
        function pollCallback()
        {
            if(xmlHttp.readyState==4&&xmlHttp.status==200)
            {
                key++;            
                var percent=xmlHttp.responseXML.getElementsByTagName("percent")[0].firstChild.nodeValue;
                var end=loadPercent(percent);            
                for(var i=1;i<=end;++i)
                {
                    var span=document.getElementById("block"+i);
                    span.innerHTML="&nbsp;&nbsp;&nbsp;";
                    span.style.backgroundColor="gray";
                }
                if(end<9)
                {
                    end++;
                    var span=document.getElementById("block"+end);
                    span.innerHTML=percent+"%";
                    setTimeout("pollServer()",1000);                
                }
                else
                {
                    document.getElementById("complete").innerHTML="complete";
                    document.getElementById("go").disabled=false;
                }
            }
        }    
        function loadPercent(percent)
        {
            if(percent.length==1)
                return 1;
            else if(percent.length==2)
                return percent.substring(0,1);
            return 9;
        }
        function checkDiv()
        {
            key=1;
            var pb=document.getElementById("progressBar");
            if(pb.style.visibility=="visible")
            {
                clearBar();
                document.getElementById("complete").innerHTML="";
            }
            else
                pb.style.visibility="visible";
        }
        function clearBar()
        {
            for(var i=1;i<=9;++i)
            {
                var elem=document.getElementById("block"+i);
                elem.innerHTML="&nbsp;&nbsp;&nbsp;";
                elem.style.backgroundColor="white";
            }
        }
        </script></head>
    <body>
        <h1>
            Ajax Progress Bar Example</h1>
        Launch long-running process:
        <input type="button" value="launch" id="go" onclick="go();" />
        <p>
            <table align="center">
                <tbody>
                    <tr>
                        <td>
                            <div id="progressBar" style="padding: 2px; border: solid black 2px; visibility: hidden">
                                <span id="block1">&nbsp;&nbsp;&nbsp;</span> <span id="block2">&nbsp;&nbsp;&nbsp;</span>
                                <span id="block3">&nbsp;&nbsp;&nbsp;</span> <span id="block4">&nbsp;&nbsp;&nbsp;</span>
                                <span id="block5">&nbsp;&nbsp;&nbsp;</span> <span id="block6">&nbsp;&nbsp;&nbsp;</span>
                                <span id="block7">&nbsp;&nbsp;&nbsp;</span> <span id="block8">&nbsp;&nbsp;&nbsp;</span>
                                <span id="block9">&nbsp;&nbsp;&nbsp;</span>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td align="center" id="complete" style="height: 21px">
                        </td>
                    </tr>                
                </tbody>
            </table>
        </p>
    </body>
    </html>
    昨晚刚写的，cs代码见下帖
      

  2.   

    protected void Page_Load(object sender, EventArgs e)
        {
            string task = this.Request.QueryString["task"];
            string percent = "";
            if (string.Compare("create", task) == 0)
            {
            }
            else
            {
                string key = this.Request.QueryString["key"];
                switch (key)
                {
                    case "1":
                        percent = "10";
                        break;
                    case "2":
                        percent = "23";
                        break;
                    case "3":
                        percent = "35";
                        break;
                    case "4":
                        percent = "51";
                        break;
                    case "5":
                        percent = "64";
                        break;
                    case "6":
                        percent = "73";
                        break;
                    case "7":
                        percent = "89";
                        break;
                    case "8":
                        percent = "100";
                        break;
                }
            }
            StringBuilder sb = new StringBuilder();
            sb.Append("<response><percent>").Append(percent).Append("</percent></response>");
            this.Response.ContentType = "text/xml";
            this.Response.Write(sb.ToString());
            this.Response.Flush();
            this.Response.Close();
        }
      

  3.   


    赞成this.Response.ContentType   =   "text/xml "; 看好格式，xml