首页 / ASP.NET / 防止重复提交仅提交一次的终极绝杀技

防止重复提交仅提交一次的终极绝杀技

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了防止重复提交仅提交一次的终极绝杀技，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含6088字，纯文字阅读大概需要9分钟。

内容图文

作者：Silent Void
出处：http://happyhippy.cnblogs.com/
最近一个客户，老抱怨每个月总有几条重复的业务数据；但创建该业务数据的页面，我们已经应用了常规的防重复提交技术，为啥还这样呢……
1. 常规防重复提交
代码如下:<asp:Button runat="server" ID="btnPostBack1" Text="按我1" UseSubmitBehavior="false" OnClientClick="this.disabled=true;this.form.submit();"/>

这里需要注意的是：
(1). UseSubmitBehavior="false" ：需要设置成false，这样生成了个的input的类型才是button；如果用默认的true，生成的input的类型为submit，postback到服务器端，将不会触发button的服务器端事件；
(2). Button不能有ValidationGroup属性，否则，postback到服务器端，将不会触发button的服务器端事件；

2. 当遇上Validator控件
如果页面上使用了Validator控件，继续使用上面1种的方法，我们会发现，Validator控件失效了。因为将button disable掉后，提交的时候将不再使用Validator控件进行校验。
针对此问题，一个解决方案，就是提交前手动校验一次。如果我们用IE Develop tool来跟踪提交的JS代码，我们会发现asp.net是在Page_ClientValidate函数中来完成Validator中设置的校验，所以下面手工调用一次该方法，如果校验失败，则不提交：
代码如下:


1: <script type="text/javascript"> 
function disableButton(button) 
{ 
if (typeof (Page_ClientValidate) == 'function' && Page_ClientValidate() == false) 
{ 
return false; 
} 
button.disabled = true; 
return true; 
} 
</script> 

<div> 
<asp:TextBox runat="server" ID="tbxInput1"></asp:TextBox> 
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="tbxInput1" 
ValidationGroup="Group1" ErrorMessage="*"></asp:RequiredFieldValidator> 
<asp:Button runat="server" ID="btnPostBack1" Text="按我1" UseSubmitBehavior="false" 
OnClientClick="disableButton(this);" OnClick="btnPostBack_Click"> 
</asp:Button> 
</div> 
 
说明：如果页面上有多个Validator控件，并且多个Button需要进行分组校验，则只需要设置Button的ValidationGroup即可。 
上面的这个方法，貌似已经完美了；通常情况下，文章写到这里也该结束了，我们的系统也是这么使用的。但是……最近一个客户，老抱怨每个月总有几条重复的业务数据。。。 
. 当用户的点击速度足够快…… 
根据客户的反馈信息，我们查了下那几条重复的业务数据，发现同样的记录偶尔会出现两次，并且DB中记录的创建时间完全相等(精确到毫秒)。然后也让用户的演示了一下她日常的操作方式，发现她点鼠标相当的快；虽然没有重现问题，但我们也大致知道问题的可能原因了：当用户点击的速度足够快，浏览器还没有来得及将button禁用掉，用户又点击了第二次…… 
为了重现问题，我们做了如下测试： 
 
 代码如下:
<script type="text/javascript"> 
function disableButton(button) //, validateGroup) 
{ 
if (typeof (Page_ClientValidate) == 'function' && Page_ClientValidate() == false) 
{ 
return false; 
} 
button.disabled = true; 
} 

function doubleClick() 
{ 
var button1 = document.getElementById('btnPostBack1'); 
button1.onclick(); 
button1.onclick(); //模拟重复点击2次 
} 
</script> 


<div> 
<asp:TextBox runat="server" ID="tbxInput1"></asp:TextBox> 
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="tbxInput1" 
ValidationGroup="Group1" ErrorMessage="*"></asp:RequiredFieldValidator> 
<asp:Button runat="server" ID="btnPostBack1" Text="按我1" UseSubmitBehavior="false" 
ValidationGroup="Group1" OnClientClick="disableButton(this);" OnClick="btnPostBack_Click"> 
</asp:Button> 
</div> 
<input type="button" onclick="doubleClick();" value="点击一次，模拟连续点击'按我1'两次" /> 
 
然后页面后台代码如下： 
 代码如下:
public static int i = 0; 
protected void btnPostBack_Click(object sender, EventArgs e) 
{ 
Response.Write(((Button)sender).Text + " " + (++i).ToString());//将累加结果
输出 
} 
 
每次页面PostBack时，全局变量+1，如果连续PostBack两次，则得到的是+2的累计。测试的结果：除了偶尔+1，大部分情况都是累加2……看来，如果用户点击鼠标的速度足够快，前面2中的办法还是无法杜绝重复提交，咋办呢？？？ 

4. 终极绝杀技
 
    处理思路就是，用数组记录用户的点击时间，如果点击时间小于某个时间间隔(下面演示的1秒，即1000毫秒)，则认为是重复提交，并取消当前点击事件，直接上代码了：
 代码如下:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<script type="text/javascript"> 
var date = new Array(); 
function disableButton(button, validateGroup) 
{ 
date.push(new Date()); 
if (date.length > 1 
&& (date[date.length - 1].getTime() - date[date.length - 2].getTime() < 1000))//小于1秒则认为重复提交 
{ 
event.cancelBubble = true; //测试时发现，如果直接单独设置cancelBubble、或者returnValue来取消事件，经常取消不了，依然存在重复提交的可能。因此只好用返回值来实现手工控制！ 
return false; 
} 
if (typeof (Page_ClientValidate) == 'function' 
&& ((validateGroup == undefined && Page_ClientValidate() == false) 
|| (validateGroup != undefined && Page_ClientValidate(validateGroup) == false))) 
{ //如果指定了ValidateGroup，则只验证改组；如果未指定，则验证全部验证控件 
return false; 
} 

button.disabled = true; 
return true; 
} 

function doubleClick() 
{ 
var button1 = document.getElementById('btnPostBack1'); 
button1.onclick(); 
button1.onclick(); 
} 
</script> 
</head> 
<body> 
<form id="form" runat="server"> 
<div> 
<asp:TextBox runat="server" ID="tbxInput1"></asp:TextBox> 
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="tbxInput1" 
ValidationGroup="Group1" ErrorMessage="*"></asp:RequiredFieldValidator> 
<asp:Button runat="server" ID="btnPostBack1" Text="按我1" UseSubmitBehavior="false" 
ValidationGroup="Group1" OnClientClick="if(!disableButton(this, 'Group1')) return false;" OnClick="btnPostBack_Click"> 
</asp:Button> 
</div> 
<div> 
<asp:TextBox runat="server" ID="tbxInput2"></asp:TextBox> 
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="tbxInput2" 
ValidationGroup="Group2" ErrorMessage="*"></asp:RequiredFieldValidator> 
<asp:Button runat="server" ID="btnPostBack2" Text="按我2" UseSubmitBehavior="false" 
OnClientClick="if(!disableButton(this)) return false;" OnClick="btnPostBack_Click"> 
</asp:Button> 
</div> 
<input type="button" onclick="doubleClick();" value="点击一次，模拟连续点击'按我1'两次" /> 
</form> 
</body> 
</html> 
 
说明： 
(1). 测试时发现，如果直接单独设置cancelBubble、或者returnValue来取消事件，经常取消不了，依然存在高频率的重复提交。因此只好用返回值来实现手工控制； 
(2). disableButton接收一个validateGroup参数，如果指定了ValidateGroup，则只验证改组；如果未指定，则验证全部验证控件。

内容总结

以上是互联网集市为您收集整理的防止重复提交仅提交一次的终极绝杀技全部内容，希望文章能够帮你解决防止重复提交仅提交一次的终极绝杀技所遇到的程序开发问题。如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/380246.html

来源：【匿名】

【上一篇】ASP.NET中实现文件的保护性下载基础篇【下一篇】asp.net伪静态关于页面优化和伪静态

更多 ►

【防止重复提交仅提交一次的终极绝杀技】教程文章相关的互联网学习教程文章

ASP.NET中防止页面刷新造成表单重复提交执行两次操作

之前看过别人防刷新的方法，是让页面刷新或返回上一步让页面过期，这里介绍一种另类的方法，使用Session来处理。实现原理：由于刷新提交表单，实际上提交的就是上一次正常提交的表单，所以我们只要做一个标志，判断出是新表单还是上一次的旧表单就可以分辨出是否进行了重复提交操作。实现方法：在页面上放置一个Hidden域，当页面第一次载入的时候，在Session里面保存一个标志，同时，把这个标志保存到页面上的Hidden里面。在提交...

asp.net页面防止重复提交示例分享

先放javascript代码：代码如下:<script type="text/javascript"> var clicks = 0; function checkclick(obj) { clicks = clicks + 1; if (clicks>1) { alert("请勿重复点击！"); return false; } return true; } </script> 下面是页面实现：代码如下:<asp:button ID="btnSubmit" runat="server" text="查询" OnClientClick="...

注册或者点击按钮时,怎么防止用户重复提交数据(实例讲解)

asp.net实现点击按钮后设按钮不可用并提交代码如下:<asp:Button ID="Button1" runat="server" Text="123456" OnClientClick="this.disabled=true;this.form.submit(); " UseSubmitBehavior= "False" onclick="Button1_Click" />客户端加载的时候，重新将这个操作再启动代码如下: <script language="javascript" type="text/javascript"> function controlButton(flag) { var btnObj = document.getEleme...

asp.net表单提交时防重复提交并执行前台的JS验证

在项目开发中，遇到这样的一个情况，就是用户重复提交。当然这个不能怪用户，只能怪.NET或者服务器反应迟钝......我是这样理解的。在网上搜了一下，解决方案是不少，比如： http://bbs.csdn.net/topics/340048988 （这个大家提了不少建议） http://www.cnblogs.com/blsong/archive/2009/12/24/1631144.html （这个基本上总结了网上的方法）但实际上做互联网web项目中，需要在前台执行JS或者Jquery的验证（主要是增强用户体验），...

Asp.net防重复提交机制实现方法

为Button或其他控件加上下面两个属性即可1.UseSubmitBehavior="false"使用服务器端提交机制，即执行OnClick事件。 2.OnClientClick客户端点击按钮后，设置控件为不可用，控件文本显示处理中…，待服务器端执行完OnClick事件，控件自动恢复为可用。代码如下：代码如下:UseSubmitBehavior="false" OnClientClick="this.disabled=true;this.value=处理中…;" UseSubmitBehavior="false" OnClientClick="this.disabled=true;this.va...

Asp.Net防止刷新重复提交数据的办法

在网上搜一下，可以找到很多关于这方面的资料，其中有一篇是来自MSDN上的一种解决方法： http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnvs05/html/BedrockASPNET.asp 它是通过重新定义 System.Web.UI.Page 类来实现加载页面时，是“刷新”、“后退”请求，还是正常请求，其他的页面则继承了自定义的这个Page类。感觉他这个方法比较独特，有例子可以下载，有兴趣的可以研究研究。网上最多的解决此类问题的...

asp.net防止刷新时重复提交(可禁用工具条刷新按钮)

前段时间遇到了需要禁用刷新的需求，f5按钮就不说了，简单的js就能把它禁用，但是工具条上的刷新按钮却傻傻干不掉。如果简单的在刷新时重新加载画面，通过window.location.href="url"可以很容易的实现，但是需求是要求在刷新时什么都不做，保留画面的状态，这下子可就复杂化了。 asp.net中分辨请求是重新请求还是通过刷新按钮再次请求不是很方便，为了实现这个效果，试过了很多的方式，一下面的两种为例 1. 代码如下:private bool...