教你制做Web实时进度条

大帝无敌大水B

大帝无敌大水B

2016-02-19 16:08

下面图老师小编跟大家分享教你制做Web实时进度条,一起来学习下过程究竟如何进行吧!喜欢就赶紧收藏起来哦~

  网上已经有很多Web进度条的例子,但是很多都是估算时间,不能正真反应任务的真实进度。我自己结合多线程和ShowModalDialog制做了一个实时进度条,原理很简单:使用线程开始长时间的任务,定义一个Session,当任务进行到不同的阶段改变Session的值,线程开始的同时使用ShowModalDialog打开一个进度条窗口,不断刷新这个窗口获取Session值,反应出实时的进度。下面就来看看具体的代码:(文章结尾处下载源代码)

  先新建一个Default.aspx页面,
  客户端代码:

  body MS_POSITIONING="GridLayout"
      form id="Form1" method="post" runat="server"
              br
              br
              asp:Button id="Button1" runat="server" Text="Start Long Task!"/asp:Button
      /form
  /body
  服务器端代码:
  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;

  namespace WebProgressBar
  {
      /**//// summary
      /// Summary description for _Default.
      /// /summary
      public class _Default : System.Web.UI.Page
      {
          protected System.Web.UI.WebControls.Button Button1;
     
          private void Page_Load(object sender, System.EventArgs e)
          {
              // Put user code to initialize the page here
          }

          Web Form Designer generated code#region Web Form Designer generated code
          override protected void OnInit(EventArgs e)
          {
              //
              // CODEGEN: This call is required by the ASP.NET Web Form Designer.
              //
              InitializeComponent();
              base.OnInit(e);
          }
         
          /**//// summary
          /// Required method for Designer support - do not modify
          /// the contents of this method with the code editor.
          /// /summary
          private void InitializeComponent()
          {   
              this.Button1.Click += new System.EventHandler(this.Button1_Click);
              this.Load += new System.EventHandler(this.Page_Load);

          }
          #endregion

          private void LongTask()
          {
              //模拟长时间任务
              //每个循环模拟任务进行到不同的阶段
              for(int i=0;i11;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();

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

              sbScript.Append("script language='JavaScript' type='text/javascript'");
              sbScript.Append("!--");
              //需要IE5.5以上支持
              sbScript.Append("window.showModalDialog('Progress.aspx','','dialogHeight: 100px; dialogWidth: 350px; edge: Raised; center: Yes; help: No; resizable: No; status: No;scroll:No;');");
              //IE5.5以下使用window.open
              //sbScript.Append("window.open('Progress.aspx','', 'height=100, width=350, toolbar =no, menubar=no, scrollbars=no, resizable=no, location=no, status=no');");
              sbScript.Append("// --");
              sbScript.Append("/script");

              Page.RegisterClientScriptBlock("OpenProgressBar", sbScript.ToString());
          }

          private void Button1_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);
          }
      }
  }

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

  
  新建一个进度条页面Progress.aspx
  客户端:
  在head中加入base target="_self"
  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
  服务器端:
  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;

  namespace WebProgressBar
  {
      /**//// summary
      /// Summary description for Progress.
      /// /summary
      public class Progress : System.Web.UI.Page
      {
          protected System.Web.UI.WebControls.Label lblMessages;
          protected System.Web.UI.WebControls.Panel panelProgress;
          protected System.Web.UI.WebControls.Panel panelBarSide;
          protected System.Web.UI.WebControls.Label lblPercent;
     
          private int state = 0;
          private void Page_Load(object sender, System.EventArgs e)
          {
              // Put user code to initialize the page here
              if(Session["State"]!=null)
              {
                  state = Convert.ToInt32(Session["State"].ToString());
              }
              else
              {
                  Session["State"]=0;
              }
              if(state0&&state=10)
              {
                  this.lblMessages.Text = "Task undertaking!";
                  this.panelProgress.Width = state*30;
                  this.lblPercent.Text = state*10 + "%";
                  Page.RegisterStartupScript("","scriptwindow.setTimeout('window.Form1.submit()',100);/script");
              }
              if(state==100)
              {
                  this.panelProgress.Visible = false;
                  this.panelBarSide.Visible = false;
                  this.lblMessages.Text = "Task Completed!";
                  Page.RegisterStartupScript("","scriptwindow.close();/script");
              }
          }

          Web Form Designer generated code#region Web Form Designer generated code
          override protected void OnInit(EventArgs e)
          {
              //
              // CODEGEN: This call is required by the ASP.NET Web Form Designer.
              //
              InitializeComponent();
              base.OnInit(e);
          }
         
          /**//// summary
          /// Required method for Designer support - do not modify
          /// the contents of this method with the code editor.
          /// /summary
          private void InitializeComponent()
          {   
              this.Load += new System.EventHandler(this.Page_Load);

          }
          #endregion
      }
  }
  源代码下载:WebProgressBar.rar

  http://justicfu.cnblogs.com/archive/2006/06/29/438433.html

展开更多 50%)
分享

猜你喜欢

教你制做Web实时进度条

Web开发
教你制做Web实时进度条

jsp进度条

Web开发
jsp进度条

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

上传的进度条 实时反映上传情况

ASP
上传的进度条 实时反映上传情况

ajax进度条

Web开发
ajax进度条

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

ASP进度条

ASP
ASP进度条

PS绘制彩色WEB下载进度条教程

电脑网络
PS绘制彩色WEB下载进度条教程

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

浪漫爱情留言代码就这样爱上了你

浪漫爱情留言代码就这样爱上了你

电脑黑屏的处理方法

电脑黑屏的处理方法
下拉加载更多内容 ↓