1. 进度条模板文件 ProgressBar.htm
- 1 <html>
- 2 <head>
- 3 <title></title>
- 4 <script language="javascript">
- 5 //设置进度条进度
- 6 function SetPorgressBar(msg, pos)
- 7 {
- 8 ProgressBar.style.width= pos + "%";
- 9 WriteText("Msg1",msg + " 已完成" + pos + "%");
- 10 }
- 11
- 12 //设置进度条完成信息
- 13 function SetCompleted(msg)
- 14 {
- 15 if(msg=="")
- 16 WriteText("Msg1","完成。");
- 17 else
- 18 WriteText("Msg1",msg);
- 19 }
- 20
- 21 // 更新文本显示信息
- 22 function WriteText(id, str)
- 23 {
- 24 var strTag = '<font face="Verdana, Arial, Helvetica" size="2" color="#ea9b02"><B>' + str + '</B></font>';
- 25 if (document.all) document.all[id].innerHTML = strTag;
- 26 }
- 27 </script>
- 28 </head>
- 29 <body>
- 30 <div id="Msg1"><font face="Verdana, Arial, Helvetica" size="2" color="#ea9b02"><b>正在加载</b></font></div>
- 31 <div id="ProgressBarSide" style="color:Silver;border-width:1px;border-style:Solid;width:300px;">
- 32 <div id="ProgressBar" style="background-color:#3366FF; height:21px; width:0%;"></div>
- 33 </div>
- 34 </body>
- 35 </html>
2. Default.aspx.cs
- 1 protected void Page_Load(object sender, EventArgs e)
- 2 {
- 3 // 根据 ProgressBar.htm 显示进度条界面
- 4 string templateFileName = Path.Combine(Server.MapPath("."), "ProgressBar.htm");
- 5 StreamReader reader = new StreamReader(@templateFileName,System.Text.Encoding.GetEncoding("gb2312"));
- 6 string html = reader.ReadToEnd();
- 7 reader.Close();
- 8 Response.Write(html);
- 9 Response.Flush();
- 10 System.Threading.Thread.Sleep(200);
- 11
- 12 // 根据处理任务处理情况更新进度条
- 13 string jsBlock;
- 14 for (int i = 1; i <= 100; i++)
- 15 {
- 16 System.Threading.Thread.Sleep(10);
- 17 jsBlock = "<script>SetPorgressBar('" + "A" + i.ToString() + "','" + i.ToString() + "'); </script>";
- 18
- 19 Response.Write(jsBlock);
- 20 Response.Flush();
- 21 }
- 22
- 23 // 处理完成
- 24 jsBlock = "<script>SetCompleted('处理完成。'); </script>";
- 25 Response.Write(jsBlock);
- 26 Response.Flush();
- 27 }
3. 运行 Default.aspx , 效果如下：
附件:
4.jpg 源代码：
