关于Asp.Net中避免用户连续多次点击按钮,重复提交表单的处理
Web页面中经常碰到这类问题,就是客户端多次点击一个按钮或者链接,导致程序出现不可预知的麻烦.
客户就是上帝,他们也不是有意要给你的系统造成破坏,这么做的原因很大一部分是因为网络慢,点击一个操作之后,系统响应慢,于是点击多次.如果我们遇到这种情况,
也许是一样的操作方法,所以解决问题才是王道.
废话不多说,直接切入正题.
方法一:在客户端制作一个遮罩层.
即用js和css制作一个纯白色或者黑色的遮罩的div,当客户端点击按钮时,弹出这个div并覆盖在当前用户界面之上,
这样遮罩层下面的内容被屏蔽,用户就无法进行鼠标的多次点击操作.
优点:一个好的遮罩层具有很美观的UI感受,并且相对降低一点用户等待服务器响应的枯燥度.
缺点:遮罩下面的内容,如果用键盘操作,比如Enter键,还是可以操作的哦.(亲,这也是后来测试中才发现的,也许还有更好的遮罩层的代码,能够做到这些吧,我是没有用过).
遮罩层代码不再给出,可以在网上搜索使用.
方法二:用js代码判断重复提交,给出提示并拒绝提交至服务器.
前台代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %> <!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></title>
</head>
<script type="text/javascript">
//记录是否重复提交表单数据
var repeatFlag = false;
function CheckRepeatClick() {
if (repeatFlag == false) {
repeatFlag = true;
return true;
}
else {
alert("数据处理中,请稍候...");
return false
}
}
</script>
<body>
<form id="form1" runat="server">
<div>
这只是个测试网页
<asp:Button ID="btnOK" runat="server" OnClick="btnOK_Click" Text="OK" OnClientClick="return CheckRepeatClick();"/>
<asp:LinkButton ID="lkbtnOK" runat="server" onclick="lkbtnOK_Click" OnClientClick="return CheckRepeatClick();" >测试LinkButton按钮</asp:LinkButton>
</div>
</form>
</body>
</html>
后台代码:
protected void btnOK_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(5000); //这里只是为了模拟后台相应慢的一个动作,替换成你自己的处理逻辑就OK了
} 效果:当单击OK按钮后,提交请求至服务器,再次单击按钮,则弹出消息"数据处理中,请稍候..."。
对于LinkButton按钮的测试也是同样道理.
代码很简单,不过多说明。
优点:方法一中的缺点在这里得到了弥补。
缺点:方法一的优点这里没有了。
所以,将方法一和方法二同时使用,则相对完美一些啦,哈哈,我就是这么使用的。
方法三:单击按钮后,用js将按钮置为不可用状态,避免用户多次单击.
前台代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" EnableEventValidation="false" %> <!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></title>
</head>
<script type="text/javascript">
//记录是否重复提交表单数据
var repeatFlag = false;
function CheckRepeatClick() {
if (repeatFlag == false) {
repeatFlag = true;
return true;
}
else {
alert("数据处理中,请稍候...");
return false
}
}
</script>
<body>
<form id="form1" runat="server">
<div>
这只是个测试网页
<asp:Button ID="btnOK" runat="server" OnClick="btnOK_Click" Text="OK" />
<asp:LinkButton ID="lkbtnOK" runat="server" onclick="lkbtnOK_Click" >测试LinkButton按钮</asp:LinkButton>
</div>
</form>
</body>
</html>
后台代码:
protected void Page_Load(object sender, EventArgs e)
{
this.btnOK.Attributes.Add(" onclick ", ClientScript.GetPostBackEventReference
(btnOK, " Click ") + " ;this.disabled=true; this.value='提交中...'; "); this.lkbtnOK.Attributes.Add(" onclick ", ClientScript.GetPostBackEventReference
(lkbtnOK, " Click ") + " ;this.disabled=true; ");
} protected void btnOK_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(5000); //这里只是为了模拟后台相应慢的一个动作,替换成你自己的处理逻辑就OK了
} protected void lkbtnOK_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(5000);
}
效果:当单击按钮OK后,按钮本身更改为灰色不可用,并更改文本为"提交中...",这时候再次单击按钮,无法向服务器发送请求,从而屏蔽了重复提交,
当服务器响应第一次请求完毕后,按钮恢复为可用状态和自己的文本。(对于LinkButton呢,我想说的是,一样可以变成灰色,但是它是可用的,再次
单击,仍然会向服务器发送请求)
优点:直接变成灰色不可用,比起再次单击一下然后给你个提示信息,要友好一些吧。
缺点:对于LinkButton该方法不凑效。
因为在项目中还要使用较多的LinkButton,所以果断放弃了该方法。
因为LinkButton生成的客户端页面中,是<a>标签,尝试使用diplay等进行修饰,都没有成功。如果有哪位大大有好的方法,不妨告知。
注意:前台页面的Page中要加上这句话 EnableEventValidation="false" 原因你懂得
关于Asp.Net中避免用户连续多次点击按钮,重复提交表单的处理的更多相关文章
- PHP防止用户重复提交表单
我们提交表单的时候,不能忽视的一个限制是防止用户重复提交表单,因为有可能用户连续点击了提交按钮或者是攻击者恶意提交数据,那么我们在提交数据后的处理如修改或添加数据到数据库时就会惹上麻烦. 那么如何规避 ...
- jsp中普通按钮如何提交表单
jsp中普通按钮如何提交表单方法1: <form action = "提交的地址"> <input type="submit" ...
- struts2中token防止重复提交表单
struts2中token防止重复提交表单 >>>>>>>>>>>>>>>>>>>&g ...
- php中限制ip段访问、禁止ip提交表单的代码
在需要禁止访问或提交表单的页面添加下面的代码进行判断就可以了. 注意:下边只是一个PHP限制IP的实例代码,如果您打算应用到CMS中,请自行修改. <?php /加IP访问限制 if(geten ...
- ASP.NET 给作为隐藏域的TextBox赋值之后提交表单,无响应?
操作步骤: 给页面隐藏TextBox赋值,然后触发ASP.NET change事件,调用ASP.NET后台方法,调用后执行客户端脚本this.RegisterClientScriptBlock(Dat ...
- yii防止延迟用户多次点击按钮重复提交数据
是不是被用户的行为所困扰? 一. 一个表单用户点击提交按钮了N次,这也导致了数据提交了N次. 为了此受到了测试的欺辱,受到了老板的批评? 不用怕,它就是来拯救你的. 第一步:打开命令行,敲入 comp ...
- Ajax在jQuery中的应用 (4)向jsp提交表单数据
ajax技术带给我们的是良好的用户体验,同时,使用jquery可以简化开发,提高工作效率. 下面就介绍一下大致的开发步骤. 工具/原料 本文中使用的是 jquery-1.3.2.min.js 方法/步 ...
- 重新理解了重定向,利用重定向可以防止用户重复提交表单(兼谈springmvc重定向操作)
自己用springmvc框架有一段时间了,但是都还一直分不清楚什么时候应该用转发,什么时候应该用重定向.可能用转发的情形太多了,以致于自己都忘记了还有重定向. 当用户提交post请求之后,刷新页面就会 ...
- 防止asp.net连续点击按钮重复提交
1.在Page_Load中添加如下代码: protected void Page_Load(object sender, EventArgs e) { this.btnEdit.Attributes[ ...
随机推荐
- 大牛博客!Spark / Hadoop / Kafka / HBase / Storm
在这里,非常感谢下面的著名大牛们,一路的帮助和学习,给予了我很大的动力! 有了Hadoop,再次有了Spark,一次又一次,一晚又一晚的努力相伴! HBase简介(很好的梳理资料) 1. 博客主页:h ...
- Eclipse下Tomcat常用设置
Eclipse下Tomcat常用设置 1,Eclipse建立Tomcat服务 1.1 新建Server 首先这里是指,jee版的Eclipse.Eclipse是没有像MyEclipse那样集成Tomc ...
- 【设计模式 - 13】之责任链模式(Chain Of Responsibility)
1 模式简介 责任链模式的简介: 1. 责任链模式为请求创建了一个接收者对象的链,每个接收者都包含对另一个接收者的引用,如果一个对象不能处理该请求,那么它会把相同的请求传给下一 ...
- 解决apache服务器本地可以访问,同局域网内他人不能访问的问题(转)
问题提出:发现这个问题时,我同学让我做好的网页小案例给他看看,我是用wamp搭建的本地服务器,本地访问地址例如为: http://localhost/Dedecms/index.php 对于其他人要访 ...
- cocos2d与cocos2d-X中的draw和update
像其它的游戏引擎一样,我们有两个不同的方法来完成draw和update. 1: Draw:每一个CCNode都有一个draw方法,每一帧都会调用.我们只在这个方法里做描绘的事情. 2: Update: ...
- ssss
18:15 2013/6/18 未结束的事情1 应用API接口切换2 03in.com 项目管理授权 软件中不成功3 党校考核时间 段列出所有 10:51 2013/6/20 daili 应用修改1 ...
- Readprocessmemory使用方法
函数功能:该函数从指定的进程中读入内存信息,被读取的区域必须具有訪问权限. 函数原型:BOOL ReadProcessMemory(HANDLE hProcess,LPCVOID lpBaseAddr ...
- 【网络通信】服务器端Socket监听80端口,建立连接传输数据时也是使用的80端口么?
1. 服务器端Socket监听80端口,建立连接传输数据时也是使用的80端口么? 答:对.建立连接时服务器会分配一个新的Socket,但是用的源端口号还是80端口.套接字是由协议类型.源IP.目的IP ...
- 10.24 noip模拟试题
尼玛pdf依旧不会粘23333 /* 每段合并到总的里面 假设总的有X个 这一段有Y个 一共有X+1个空 那么就有 C(X+1,1)+C(X+1,2)+C(X+1,3)+...+C(X+1,Y) 这样 ...
- Asp.net Mvc 第二回 UrlRouting
一.什么是UrlRouting 你可以使用UrlRouting来配置一些URL的映射,使用户可以按你的规则来访问网站. 使用UrlRouting,一定要规定URL模式,它包括一个位置标识,它将在你请求 ...