教你制做Web实时进度条

最新推荐文章于 2023-01-27 21:02:20 发布

原创最新推荐文章于 2023-01-27 21:02:20 发布 · 962 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#web #session #server #xhtml #asp #button

ASP.NET 专栏收录该内容

16 篇文章

订阅专栏

本文介绍了一种使用线程和进度条在Web应用中实时监控长时间任务的方法，通过创建Default.aspx页面和Progress.aspx进度条页面，实现了任务状态的实时更新和反馈。包括客户端和服务器端代码实现细节。

原理：使用线程开始长时间的任务，定义一个Session，当任务进行到不同的阶段改变Session的值，线程开始的同时使用ShowModalDialog打开一个进度条窗口，不断刷新这个窗口获取Session值，反应出实时的进度。

步骤如下：

1、先新建一个Default.aspx页面，客户端代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!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 runat="server"> <title>Web实时进度条</title> </head> <body> <form id="formDefault" runat="server"> <div> <asp:Button id="btnStart" runat="server" Text="启动!"></asp:Button> </div> </form> </body> </html>

服务器代码：

using System; using System.Collections; using System.ComponentModel; using System.Data; using System.Drawing; using System.Web; using System.Web.SessionState; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.HtmlControls; using System.Text; public partial class _Default : System.Web.UI.Page { protected System.Web.UI.WebControls.Button Button1; private void Page_Load(object sender, System.EventArgs e) { } override protected void OnInit(EventArgs e) { InitializeComponent(); base.OnInit(e); } private void InitializeComponent() { this.btnStart.Click += new System.EventHandler(this.btnStart_Click); this.Load += new System.EventHandler(this.Page_Load); } private void LongTask() { //模拟长时间任务 //每个循环模拟任务进行到不同的阶段 for (int i = 0; i < 11; i++) { System.Threading.Thread.Sleep(1000); //设置每个阶段的state值，用来显示当前的进度 Session["State"] = i + 1; } //任务结束 Session["State"] = 100; } public static void OpenProgressBar(System.Web.UI.Page Page) { StringBuilder sbScript = new StringBuilder(); sbScript.Append("<mce:script language='JavaScript' type='text/javascript'>/n"); sbScript.Append(" // --></mce:script>/n"); Page.RegisterClientScriptBlock("OpenProgressBar", sbScript.ToString()); } private void btnStart_Click(object sender, System.EventArgs e) { System.Threading.Thread thread = new System.Threading.Thread(new System.Threading.ThreadStart(LongTask)); thread.Start(); Session["State"] = 1; OpenProgressBar(this.Page); } }

2、新建一个进度条页面Progress.aspx，客户端代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Progress.aspx.cs" Inherits="Progress" %> <!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 runat="server"> <base target="_self"> <title></title> </head> <body ms_positioning="GridLayout"> <form id="Form1" method="post" runat="server"> <asp:Label ID="lblMessages" runat="server"></asp:Label> <asp:Panel ID="panelBarSide" runat="server" Width="300px" BorderStyle="Solid" BorderWidth="1px" ForeColor="Silver"> <asp:Panel ID="panelProgress" runat="server" Width="10px" BackColor="Green"> </asp:Panel> </asp:Panel> <asp:Label ID="lblPercent" runat="server" ForeColor="Blue"></asp:Label> </form> </body> </html>

服务器代码：

using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class Progress : System.Web.UI.Page { private int state = 0; private void Page_Load(object sender, System.EventArgs e) { if (Session["State"] != null) { state = Convert.ToInt32(Session["State"].ToString()); } else { Session["State"] = 0; } if (state > 0 && state <= 10) { this.lblMessages.Text = "Task undertaking!"; this.panelProgress.Width = state * 30; this.lblPercent.Text = state * 10 + "%"; Page.RegisterStartupScript("", "<mce:script type="text/javascript"></mce:script>"); } if (state == 100) { this.panelProgress.Visible = false; this.panelBarSide.Visible = false; this.lblMessages.Text = "Task Completed!"; Page.RegisterStartupScript("", "<mce:script type="text/javascript"></mce:script>"); } } override protected void OnInit(EventArgs e) { InitializeComponent(); base.OnInit(e); } private void InitializeComponent() { this.Load += new System.EventHandler(this.Page_Load); } }