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 , 效果如下：

 

源代码：