1 <html xmlns="http://www.w3.org/1999/xhtml" id="mainWindow"> 2 <head> 3 <title>无标题页</title> 4 <script language="javascript"> 5 function SetPorgressBar(pos) 6 { 7 //设置进度条居中 8 var screenHeight = window["mainWindow"].offsetHeight; 9 var screenWidth = window["mainWindow"].offsetWidth; 10 ProgressBarSide.style.width = Math.round(screenWidth / 2); 11 ProgressBarSide.style.left = Math.round(screenWidth / 4); 12 ProgressBarSide.style.top = Math.round(screenHeight / 2); 13 ProgressBarSide.style.height = "21px"; 14 ProgressBarSide.style.display = ""; 15 16 //设置进度条百分比 17 ProgressBar.style.width = pos + "%"; 18 ProgressText.innerHTML = pos + "%"; 19 } 20 21 //完成后隐藏进度条 22 function SetCompleted() 23 { 24 ProgressBarSide.style.display = "none"; 25 } 26 </script> 27 </head> 28 <body> 29 <div id="ProgressBarSide" style="position:absolute;height:21x;100px;color:Silver;border-1px;border-style:Solid;display:none"> 30 <div id="ProgressBar" style="position:absolute;height:21px;0%;background-color:#3366FF"></div> 31 <div id="ProgressText" style="position:absolute;height:21px;100%;text-align:center"></div> 32 </div> 33 </body> 34 </html>
后台代码:
1 Default.aspx.cs: 2 3 using System; 4 using System.Data; 5 using System.Configuration; 6 using System.Web; 7 using System.Web.Security; 8 using System.Web.UI; 9 using System.Web.UI.WebControls; 10 using System.Web.UI.WebControls.WebParts; 11 using System.Web.UI.HtmlControls; 12 using System.Threading; 13 using System.IO; 14 15 public partial class _Default : System.Web.UI.Page 16 { 17 private void beginProgress() 18 { 19 //根据ProgressBar.htm显示进度条界面 20 string templateFileName = Path.Combine(Server.MapPath("."), "ProgressBar.htm"); 21 StreamReader reader = new StreamReader(@templateFileName,System.Text.Encoding.GetEncoding("GB2312")); 22 string html = reader.ReadToEnd(); 23 reader.Close(); 24 Response.Write(html); 25 Response.Flush(); 26 } 27 28 private void setProgress(int percent) 29 { 30 string jsBlock = "<script>SetPorgressBar('" + percent.ToString() + "'); </script>"; 31 Response.Write(jsBlock); 32 Response.Flush(); 33 } 34 35 private void finishProgress() 36 { 37 string jsBlock = "<script>SetCompleted();</script>"; 38 Response.Write(jsBlock); 39 Response.Flush(); 40 } 41 42 private void Page_Load(object sender, System.EventArgs e) 43 { 44 beginProgress(); 45 46 for (int i = 1; i <= 100; i++) 47 { 48 setProgress(i); 49 50 //此处用线程休眠代替实际的操作,如加载数据等 51 System.Threading.Thread.Sleep(50); 52 } 53 54 finishProgress(); 55 } 56 }