页面提交处理时候显示“正在处理,请稍后……”,防止二次提交功能。
1.Ajax实现
页面提交处理时候显示“正在处理,请稍后……”,防止二次提交功能。
在后台处理事件代码中添加: System.Threading.Thread.Sleep(1000);延迟处理可以显示效果


<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script type="text/javascript">
function SendConfirm()
{
window.returnValue = true;
window.close();
}
</script>
<style type="text/css">
.progressBackground {
background-color:menu;
filter:alpha(opacity=50);}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" runat="server" />
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<div id="ad1" style="width: 100%; z-index: 20; margin: 0 auto; border: 0px; height: 100%;
position: absolute; top: 0; left: 0; border: 0; text-align: center;">
<table width="100%" height="100%" border="0">
<tr>
<td align="center">
<div>
<div style="height: 27px; width: 300px; background: url(../Images/Titlebg.gif) repeat-x center;">
</div>
<table style="background-color: white; border: 1px solid #00ccff;" width="300" height="60">
<tr>
<td width="60" align="right">
<img src="../Images/Loading.gif" /></td>
<td>
<p style=" text-align:left;">
正在处理,请稍后……</p>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
<iframe id="frmBg" class="progressBackground" style="position: absolute; z-index: 0;
top: 0; left: 0; width: expression(document.body.scrollWidth); height: expression(document.body.scrollHeight);"
frameborder="0"></iframe>
<div id="divBg" class="progressBackground" style="position: absolute; top: 0; left: 0;
z-index: 10; margin: 0 auto; border: 0; width: expression(document.body.scrollWidth);
height: expression(document.body.scrollHeight);" />
</ProgressTemplate>
</asp:UpdateProgress>
</form>
</body>
</html>
2.javascript实现


Show("正在处理,请稍后……");
function $()
{
var elements = new Array();
for (var i = 0; i < arguments.length; i++)
{
var element = arguments[i];
if (typeof element == 'string')
element = document.getElementById(element);
if (arguments.length == 1)
return element;
elements.push(element);
}
return elements;
}
function Show(message){
HideElement();
var eSrc=(document.all)?window.event.srcElement:arguments[1];
var shield = document.createElement("DIV");//产生一个背景遮罩层
shield.id = "shield";
shield.style.position = "absolute";
shield.style.left = "0px";
shield.style.top = "0px";
shield.style.width = "100%";
shield.style.height = ((document.documentElement.clientHeight>document.documentElement.scrollHeight)?document.documentElement.clientHeight:document.documentElement.scrollHeight)+"px";
shield.style.background = "menu";
shield.style.textAlign = "center";
shield.style.zIndex = "10000";
shield.style.filter = "alpha(opacity=0)";
shield.style.opacity = 0;
var alertFram = document.createElement("DIV");//产生一个提示框
strHtml="<div id=\"ad1\" style=\"width: 100%; z-index: 100; margin: 0 auto; border: 0px; height: 100%;position: absolute; top: 0; left: 0; border: 0; text-align: center;\"><table width=\"100%\" height=\"100%\" border=\"0\"><tr><td align=\"center\"><div><div style=\"height: 27px; width: 300px; background: url(Images/Titlebg.gif) repeat-x center;\"></div><table style=\"background-color: white; border: 1px solid #00ccff;\" width=\"300\" height=\"60\"><tr><td width=\"60\" align=\"right\"><img src=\"Images/Loading.gif\" /></td><td><p style=\" text-align:left;\">"+message+"</p></td></tr></table></div></td></tr></table></div><iframe id=\"frmBg\" class=\"progressBackground\" style=\"position: absolute; z-index: 0;top: 0; left: 0; width: expression(document.body.scrollWidth); height: expression(document.body.scrollHeight);\" frameborder=\"0\"></iframe><div id=\"divBg\" class=\"progressBackground\" style=\"position: absolute; top: 0; left: 0;z-index: 10; margin: 0 auto; border: 0; width: expression(document.body.scrollWidth);height: expression(document.body.scrollHeight);\" />";
alertFram.innerHTML=strHtml;
document.body.appendChild(alertFram);
//document.body.appendChild(shield);
this.setOpacity = function(obj,opacity){
if(opacity>=1)opacity=opacity/100;
try{ obj.style.opacity=opacity; }catch(e){}
try{
if(obj.filters.length>0&&obj.filters("alpha")){
obj.filters("alpha").opacity=opacity*100;
}else{
obj.style.filter="alpha(opacity=\""+(opacity*100)+"\")";
}
}
catch(e){}
}
var c = 0;
this.doAlpha = function(){
if (++c > 20){clearInterval(ad);return 0;}
setOpacity(shield,c);
}
var ad = setInterval("doAlpha()",1);//渐变效果
eSrc.blur();
document.body.onselectstart = function(){return false;}
document.body.oncontextmenu = function(){return false;}
}
//隐藏页面上一些特殊的控件
function HideElement(){
var HideElementTemp = new Array('IMG','SELECT','OBJECT','IFRAME');
for(var j=0;j<HideElementTemp.length;j++){
try{
var strElementTagName=HideElementTemp[j];
for(i=0;i<document.all.tags(strElementTagName).length; i++){
var objTemp = document.all.tags(strElementTagName)[i];
if(!objTemp||!objTemp.offsetParent)
continue;
objTemp.disabled="disabled"
}
}
catch(e){}
}
}
//添加取消处理
function Close(){
var shield= $("shield");
var alertFram= $("alertFram");
if(shield!=null) {
document.body.removeChild(shield);
}
if(alertFram!=null) {
document.body.removeChild(alertFram);
}
document.body.onselectstart = function(){return true};
document.body.oncontextmenu = function(){return true};
}
———————————————————————————————————
浩瀚的天空,会有改变的希望,世界会不会变得更加好,选择在於我们的手上。
标签:
JavaScript
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义