ASP.NET实现进度条

在网上查阅了很多相关资料，参照对比一番后自己整理了一下，做了个小例子。能够实现根据后台数据加载的进度在前台动态更新进度条、进度条在页面居中显示、在进度条内显示百分比，完成进度后隐藏进度条。个人感觉还是有一定的参考价值，贴出来先。

建立一个WEB工程，添加新项->HTML页面，命名为ProgressBar.htm，内容如下：

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
hNp hS0 < html  xmlns ="http://www.w3.org/1999/xhtml"  id ="mainWindow" > ITPUB个人空间8Be,PwEX:a#_
< head > ITPUB个人空间kRR,@5fX3MV+@m7H*m
     < title > 无标题页 </ title > ITPUB个人空间%Y,fD\6u
     < script  language ="javascript" >
t*\i6v Jc6av0         function  SetPorgressBar(pos)ITPUB个人空间j8T!GAuj:l/_j%j
        {ITPUB个人空间.h&RQ Y8rq8t h!e+FP
             // 设置进度条居中
G+Cr:dcdA;\4TkQ0              var  screenHeight  =  window[ " mainWindow " ].offsetHeight;
S[7w;?.aeh0             var  screenWidth  =  window[ " mainWindow " ].offsetWidth;ITPUB个人空间~-X V`8M
            ProgressBarSide.style.width  =  Math.round(screenWidth  /  2 );ITPUB个人空间 b8`P h$|
            ProgressBarSide.style.left  =  Math.round(screenWidth  /  4 );
Y"M9[Oewc0            ProgressBarSide.style.top  =  Math.round(screenHeight  /  2 );ITPUB个人空间&eL~i1t)o/x+|&B
            ProgressBarSide.style.height  =  " 21px " ;ITPUB个人空间,U+Fv"X VMV/N
            ProgressBarSide.style.display  =  "" ;
r`7Y0o%R0             
i!hP8\N"L0             // 设置进度条百分比                        ITPUB个人空间.E r.PK|fZ
            ProgressBar.style.width  =  pos  +  " % " ;ITPUB个人空间JP:Rki}$Hk?
            ProgressText.innerHTML  =  pos  +  " % " ;ITPUB个人空间#U F^ S4k1S7f1B
        }
-N+`2vL%]#qC0
8@!Q6K-l/a;G0         // 完成后隐藏进度条
)dF9SY,z#IT0          function  SetCompleted()ITPUB个人空间3j#_#fY%aJ+EMcj
        {       
#Qk Usl]i0            ProgressBarSide.style.display  =  " none " ;
.D2W!bD^"bz,e0        }ITPUB个人空间#EB$KYt)n(_
      </ script >   
;[q9Y,]w3Z6V+kk0 </ head > ITPUB个人空间#rVY nX.r
     < body >
}%G/FI-Xb;f0     < div  id ="ProgressBarSide"  style ="position:absolute;height:21x;width:100px;color:Silver;border-width:1px;border-style.:Solid;display:none" >
9OP4W4_'QYIV'R0M0         < div  id ="ProgressBar"  style ="position:absolute;height:21px;width:0%;background-color:#3366FF" ></ div >
(j7W}W*C-E0         < div  id ="ProgressText"  style ="position:absolute;height:21px;width:100%;text-align:center" ></ div >
7M;n I"N$a&P1f;N0     </ div >
+zp6RZ IO}5Jl!W0     </ body >
7wo;U ~1_0 </ html >

后台代码，Default.aspx.cs：

using  System;
gs(o a4v/Y(a:_.A0 using  System.Data;
,O N'Uf/Dl R0 using  System.Configuration;ITPUB个人空间.wA(l6k gF6_RuO6}
using  System.Web;
%}@i8@O4Uy:W0 using  System.Web.Security;
q"@ w2~2OT*~0 using  System.Web.UI;
LZ/~ b0K!H2iq0 using  System.Web.UI.WebControls;ITPUB个人空间C*V2Pt:X}3z
using  System.Web.UI.WebControls.WebParts;ITPUB个人空间.x;d~8vF
using  System.Web.UI.HtmlControls;ITPUB个人空间e]9S0pQ
using  System.Threading;ITPUB个人空间OZ [ atYM
using  System.IO;
^.k LZxc$CRpFe.C8a0
u{/~9D7t0a~0 public  partial  class  _Default : System.Web.UI.Page 
/~ rh6f#?X8r0{
u K$^1d#k}&s0     private  void  beginProgress()ITPUB个人空间~"v0k-t1Z0v8@
    {
Rk?.Gz(pV+R0         // 根据ProgressBar.htm显示进度条界面
MY KE I0          string  templateFileName  =  Path.Combine(Server.MapPath( " . " ),  " ProgressBar.htm " );
],kRqt`kz8Y-x0        StreamReader reader  =  new  StreamReader(@templateFileName,System.Text.Encoding.GetEncoding( " GB2312 " ));ITPUB个人空间 { n]4z I%]3@q
         string  html  =  reader.ReadToEnd();ITPUB个人空间GIo5E7t){-C
        reader.Close();ITPUB个人空间;?%_$dE1hQkTc
        Response.Write(html);
\+Y2w+|J"w0        Response.Flush();
EBw W hL0    }
0J:E$~V3~ F A0
c mM-XSA/~0     private  void  setProgress( int  percent)
:Y/MB'eJ*|&^`0    {ITPUB个人空间 iv So0W6M+n M4@
         string  jsBlock  =  " <script>SetPorgressBar(' "  +  percent.ToString()  +  " '); </script> " ;ITPUB个人空间H Y^U{N|)X/k}}
        Response.Write(jsBlock);ITPUB个人空间Vhku,U` }m
        Response.Flush();
-Jr8a#H H`(C0    }ITPUB个人空间|up%fj7H

8N/T6cD~#BK0     private  void  finishProgress()
t*w*mvV#f0    {
? Fo_-X0         string  jsBlock  =  " <script>SetCompleted();</script> " ;
i:t3_ WWX%zU!N0        Response.Write(jsBlock);
~JT5|]!J0        Response.Flush();
g0\Df"ZGb0    }
3JZ0xm7[.r0@$Ar'h0
+T jRF%G f0     private  void  Page_Load( object  sender, System.EventArgs e) ITPUB个人空间8SG2N'~_4N/An#}"D
    {
#T |5h$c0~T)e dA0        beginProgress();ITPUB个人空间k4dB8a;r#d

.LQ a5[$r}7F0         for  ( int  i  =  1 ; i  <=  100 ; i ++ )ITPUB个人空间v0BBi,R[&d2@ i {] p
        {ITPUB个人空间{ m-a.p~ NJ!N4d
            setProgress(i);ITPUB个人空间 y*zf*X8QA:u9c T

}9[7kR5oP3x0_0             // 此处用线程休眠代替实际的操作，如加载数据等 ITPUB个人空间+mC:b&G!Wk
            System.Threading.Thread.Sleep( 50 );ITPUB个人空间N;~1e/w(hA
        }ITPUB个人空间EU\,PZQ.t!sM

B0uv.KyA s~:r&|0}0        finishProgress(); 
5\hX7c i${o0    } 
!k.o9?6YF8i0}

前台页面代码在此省略，可以放置任意控件。

转自：http://blog.youkuaiyun.com/reonlyrun/archive/2006/12/27/1464372.aspx