效果图
1.aspx页面
html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<script src="TankInvt.js" type="text/javascript"></script>
<link href="Stylesheet1.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button Text ="ceshi" runat ="server" ID ="ceshi"
οnclick="ceshi_Click" style="margin-bottom: 0px" />
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True"
>
<asp:ListItem>111</asp:ListItem>
<asp:ListItem>22</asp:ListItem>
<asp:ListItem>33</asp:ListItem>
<asp:ListItem>444</asp:ListItem>
</asp:DropDownList>
<asp:Button ID="ddlbut" runat="server"
οnclick="ddlbut_Click" Text="Button" style=" display :none" />
<asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True" ></asp:TextBox>
<asp:Button ID="txtbut" runat="server" οnclick="txtbut_Click" Text="Button" style=" display :none" />
<div id="main">
<div style="z-index: 1; position: absolute; width: 300px;left: 400px; top: 200px;background-color:window;display:none;" id="loadinfo">
<span style=" color: Green ; font-size: 16px; font-weight: bold" >正在处理数据 loading...</span></div>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<br />
</div>
</form>
</body>
</html>
2.cs页面
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebApplication12
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
this.ceshi.Attributes.Add("onclick", "return Showloadinfo();");
this.DropDownList1.Attributes.Add("onchange", "return Showloadinfo1();");
this.TextBox1.Attributes.Add("onchange", "return Showloadinfo3();");
}
protected void ceshi_Click(object sender, EventArgs e)
{
long num=0;
for (int i = 1; i < 10; i++)
{
System.Threading.Thread.Sleep(100);
num += i;
}
this.Label1.Text = num.ToString();
//Response.Write("<script language='javascript'>alert('保存成功!');</script>");
ScriptManager.RegisterStartupScript(this.ceshi, this.GetType(), "alertScript", "Closeloadinfo();", true);
// ScriptManager.RegisterStartupScript(this.ceshi, this.GetType(), "alertScript", "AlertSuccess();", true);
//
// ClientScript.RegisterStartupScript(ClientScript.GetType(), "myscript", "<script>AlertSuccess();</script>");
}
protected void ddlbut_Click(object sender, EventArgs e)
{
long num = 0;
for (int i = 1; i < 10; i++)
{
System.Threading.Thread.Sleep(500);
num += i;
}
this.Label1.Text = num.ToString();
this.Label1.Text = this.DropDownList1.SelectedItem.Text +"---"+this.DropDownList1.SelectedItem.Value ;
ScriptManager.RegisterStartupScript(this.DropDownList1 , this.GetType(), "alertScript", "Closeloadinfo();", true);
}
protected void txtbut_Click(object sender, EventArgs e)
{
long num = 0;
for (int i = 1; i < 10; i++)
{
System.Threading.Thread.Sleep(500);
num += i;
}
this.Label1.Text = num.ToString();
this.Label1.Text = this.TextBox1 .Text ;
ScriptManager.RegisterStartupScript(this.TextBox1 , this.GetType(), "alertScript", "Closeloadinfo();", true);
}
}
}
3.js 页面
function Showloadinfo() {
self.document.getElementById("loadinfo").style.display = "inline";
self.document.getElementById("main").disabled = true;
}
function Showloadinfo1() {
self.document.getElementById("loadinfo").style.display = "inline";
self.document.getElementById("main").disabled = true;
document.getElementById("ddlbut").click();
}
function Showloadinfo2() {
self.document.getElementById("loadinfo").style.display = "inline";
self.document.getElementById("main").disabled = true;
document.getElementById("txtbut").click();
}
function Closeloadinfo() {
self.document.getElementById("loadinfo").style.display = "none";
self.document.getElementById("main").disabled = false;
}
注:当要在下拉表控件和文本控件改变时添加进度条 使用的方法