欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

防止重復(fù)提交 僅提交一次的終極絕殺技

 更新時間:2010年08月16日 23:27:21   作者:  
防止重復(fù)提交,通用的思路,就是當(dāng)用戶點擊提交按鈕后,在瀏覽器中用JS將按鈕disable掉,從而阻止用戶繼續(xù)點擊該按鈕,實現(xiàn)防止重復(fù)提交的目的。網(wǎng)上防止重復(fù)提交的文章已經(jīng)不少了,為啥我還要寫呢,顯然我不是吃飽了撐的。。。
作者:Silent Void
出處:http://happyhippy.cnblogs.com/
最近一個客戶,老抱怨每個月總有幾條重復(fù)的業(yè)務(wù)數(shù)據(jù);但創(chuàng)建該業(yè)務(wù)數(shù)據(jù)的頁面,我們已經(jīng)應(yīng)用了常規(guī)的防重復(fù)提交技術(shù),為啥還這樣呢……
1. 常規(guī)防重復(fù)提交
復(fù)制代碼 代碼如下:
<asp:Button runat="server" ID="btnPostBack1" Text="按我1" UseSubmitBehavior="false" OnClientClick="this.disabled=true;this.form.submit();"/>


這里需要注意的是:
(1). UseSubmitBehavior="false" :需要設(shè)置成false,這樣生成了個的input的類型才是button;如果用默認的true,生成的input的類型為submit,postback到服務(wù)器端,將不會觸發(fā)button的服務(wù)器端事件;
(2). Button不能有ValidationGroup屬性,否則,postback到服務(wù)器端,將不會觸發(fā)button的服務(wù)器端事件;

2. 當(dāng)遇上Validator控件
如果頁面上使用了Validator控件,繼續(xù)使用上面1種的方法,我們會發(fā)現(xiàn),Validator控件失效了。因為將button disable掉后,提交的時候?qū)⒉辉偈褂肰alidator控件進行校驗。
針對此問題,一個解決方案,就是提交前手動校驗一次。如果我們用IE Develop tool來跟蹤提交的JS代碼,我們會發(fā)現(xiàn)asp.net是在Page_ClientValidate函數(shù)中來完成Validator中設(shè)置的校驗,所以下面手工調(diào)用一次該方法,如果校驗失敗,則不提交:
復(fù)制代碼 代碼如下:

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需要進行分組校驗,則只需要設(shè)置Button的ValidationGroup即可。
上面的這個方法,貌似已經(jīng)完美了;通常情況下,文章寫到這里也該結(jié)束了,我們的系統(tǒng)也是這么使用的。但是……最近一個客戶,老抱怨每個月總有幾條重復(fù)的業(yè)務(wù)數(shù)據(jù)。。。
. 當(dāng)用戶的點擊速度足夠快……
根據(jù)客戶的反饋信息,我們查了下那幾條重復(fù)的業(yè)務(wù)數(shù)據(jù),發(fā)現(xiàn)同樣的記錄偶爾會出現(xiàn)兩次,并且DB中記錄的創(chuàng)建時間完全相等(精確到毫秒)。然后也讓用戶的演示了一下她日常的操作方式,發(fā)現(xiàn)她點鼠標相當(dāng)?shù)目?;雖然沒有重現(xiàn)問題,但我們也大致知道問題的可能原因了:當(dāng)用戶點擊的速度足夠快,瀏覽器還沒有來得及將button禁用掉,用戶又點擊了第二次……
為了重現(xiàn)問題,我們做了如下測試:
ClickMe 
復(fù)制代碼 代碼如下:

<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(); //模擬重復(fù)點擊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="點擊一次,模擬連續(xù)點擊'按我1'兩次" />

然后頁面后臺代碼如下:
復(fù)制代碼 代碼如下:

public static int i = 0;
protected void btnPostBack_Click(object sender, EventArgs e)
{
Response.Write(((Button)sender).Text + " " + (++i).ToString());//將累加結(jié)果輸出
}

每次頁面PostBack時,全局變量+1,如果連續(xù)PostBack兩次,則得到的是+2的累計。測試的結(jié)果:除了偶爾+1,大部分情況都是累加2……看來,如果用戶點擊鼠標的速度足夠快,前面2中的辦法還是無法杜絕重復(fù)提交,咋辦呢???
4. 終極絕殺技

ClickMe2

    處理思路就是,用數(shù)組記錄用戶的點擊時間,如果點擊時間小于某個時間間隔(下面演示的1秒,即1000毫秒),則認為是重復(fù)提交,并取消當(dāng)前點擊事件,直接上代碼了:

復(fù)制代碼 代碼如下:

<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秒則認為重復(fù)提交
{
event.cancelBubble = true; //測試時發(fā)現(xiàn),如果直接單獨設(shè)置cancelBubble、或者returnValue來取消事件,經(jīng)常取消不了,依然存在重復(fù)提交的可能。因此只好用返回值來實現(xiàn)手工控制!
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="點擊一次,模擬連續(xù)點擊'按我1'兩次" />
</form>
</body>
</html>

說明:
(1). 測試時發(fā)現(xiàn),如果直接單獨設(shè)置cancelBubble、或者returnValue來取消事件,經(jīng)常取消不了,依然存在高頻率的重復(fù)提交。因此只好用返回值來實現(xiàn)手工控制;
(2). disableButton接收一個validateGroup參數(shù),如果指定了ValidateGroup,則只驗證改組;如果未指定,則驗證全部驗證控件。

相關(guān)文章

  • 如何將asp.net core程序部署到Linux服務(wù)器

    如何將asp.net core程序部署到Linux服務(wù)器

    這篇文章主要介紹了將asp.net core程序部署到Linux服務(wù)器上的詳細過程,本文給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2022-09-09
  • ASP.NET MVC 數(shù)據(jù)驗證及相關(guān)內(nèi)容

    ASP.NET MVC 數(shù)據(jù)驗證及相關(guān)內(nèi)容

    這篇文章主要介紹了ASP.NET MVC 數(shù)據(jù)驗證及相關(guān)內(nèi)容的相關(guān)資料,需要的朋友可以參考下
    2014-10-10
  • Net Core Web Api項目與在NginX下發(fā)布的方法

    Net Core Web Api項目與在NginX下發(fā)布的方法

    這篇文章主要介紹了Net Core Web Api項目與在NginX下發(fā)布的方法,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2020-03-03
  • ASP.NET頁面?zhèn)鬟f值的方式介紹

    ASP.NET頁面?zhèn)鬟f值的方式介紹

    面?zhèn)髦凳菍W(xué)習(xí)asp.net初期都會面臨的一個問題,總的來說有頁面?zhèn)髦?、存儲對象傳值、ajax、類、model、表單等。但是一般來說,常用的較簡單有QueryString,Session,Cookies,Application,Server.Transfer。
    2012-12-12
  • C#中的FileUpload 選擇后的預(yù)覽效果具體實現(xiàn)

    C#中的FileUpload 選擇后的預(yù)覽效果具體實現(xiàn)

    選擇后的預(yù)覽效果實現(xiàn)的方法有很多,在本文為大家介紹下使用C#中的FileUpload是如何實現(xiàn)的,感興趣的朋友不要錯過
    2013-12-12
  • asp.net利用cookie保存用戶密碼實現(xiàn)自動登錄的方法

    asp.net利用cookie保存用戶密碼實現(xiàn)自動登錄的方法

    這篇文章主要介紹了asp.net利用cookie保存用戶密碼實現(xiàn)自動登錄的方法,實例分析了asp.net針對cookie的創(chuàng)建、提取與銷毀操作技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-01-01
  • ASP.NET?Core集成Apollo(阿波羅)

    ASP.NET?Core集成Apollo(阿波羅)

    這篇文章介紹了ASP.NET?Core集成Apollo的方法,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2022-04-04
  • .NET Core控制臺應(yīng)用程序如何使用異步(Async)Main方法詳解

    .NET Core控制臺應(yīng)用程序如何使用異步(Async)Main方法詳解

    這篇文章主要給大家介紹了關(guān)于.NET Core控制臺應(yīng)用程序如何使用異步(Async)Main方法的相關(guān)資料,文中通過圖文介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2018-07-07
  • ASP.NET編程簡單實現(xiàn)生成靜態(tài)頁面的方法【附demo源碼下載】

    ASP.NET編程簡單實現(xiàn)生成靜態(tài)頁面的方法【附demo源碼下載】

    這篇文章主要介紹了ASP.NET編程簡單實現(xiàn)生成靜態(tài)頁面的方法,較為詳細的分析了asp.net生成靜態(tài)頁面的步驟與相關(guān)操作技巧,并附帶相關(guān)實例源碼供讀者下載參考,需要的朋友可以參考下
    2017-07-07
  • 詳解使用asp.net mvc部分視圖渲染html

    詳解使用asp.net mvc部分視圖渲染html

    為了提升用戶體驗,一般我們采用ajax加載數(shù)據(jù)然后根據(jù)數(shù)據(jù)渲染html,渲染html可以使用前端渲染和服務(wù)器端渲染,有興趣的可以了解一下
    2017-07-07

最新評論