當前位置:首頁 » 網頁前端 » 前端連續點擊如何防止重復提交
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

前端連續點擊如何防止重復提交

發布時間: 2022-04-28 03:24:38

『壹』 JSP中如何防用戶重復提交

onclick= 將時間放在一個隱藏文本框裡面,後台獲取放在session裡面,如果與上一次的相同則為重復提交 是24小時內呢 還是就是這一天呢。看你的這個需求,session也不好搞,session有生命周期的(雖然伺服器可以手動設置時間),但是如果伺服器中斷重啟,session就沒有了。還是保存資料庫吧,給這個用戶添加個欄位(更新時間),登錄後判斷當前日期是否跟更新日期一樣,一樣說明已經登錄過了,當前日期大於更新日期,說明今天還沒登錄,然後修改更新日期為當天日期

『貳』 .net core savechanges 網路不好情況下,如何防止用戶連擊重復提交數據

1、前端提交處理顯示遮罩層,如果後台無返回則顯示提交中,直到後台返回成功才進行遮罩層的取消

2、後台可以進行唯一標識符的判定比如名稱是否一樣等等來進行重復提交數據的更新或者丟企

『叄』 ASP.NET如何防止頁面重復提交

用戶點擊提交按鈕後,通過JavaScript腳本將提交按鈕disable掉,同時顯示動畫提示用戶系統正在處理,並觸發伺服器端事件。具體是通過在Page_Load事件中添加如下代碼實現的:

//sb保存的是JavaScript腳本代碼,點擊提交按鈕時執行該腳本
StringBuilder sb = new StringBuilder();
//保證驗證函數的執行
sb.Append("if (typeof(Page_ClientValidate) == 'function') { if (Page_ClientValidate() == false) { return false; }};");
//點擊提交按鈕後設置Button的disable屬性防止用戶再次點擊,注意這里的this是JavaScript代碼
sb.Append("this.disabled = true;");
//用__doPostBack來提交,保證按鈕的伺服器端click事件執行
sb.Append(this.ClientScript.GetPostBackEventReference(this.btnSubmit, ""));
sb.Append(";");
//SetUIStyle()是JavaScript函數,點擊提交按鈕後執行,如可以顯示動畫效果提示後台處理進度
//注意SetUIStyle()定義在aspx頁面中
sb.Append("SetUIStyle();");
//給提交按鈕增加OnClick屬性
this.btnSubmit.Attributes.Add("onclick", sb.ToString());

『肆』 求JS 大神指導,頁面的防止重復點擊事件(具體見補充)

  • 可以添加標記,第一次點擊後變為false,每次點擊判斷這個標記是true才執行。

  • 如果是按鈕防止重復點擊,可以再按鈕點擊後,給按鈕添加disabled屬性。

『伍』 jquery 如何防止重復提交

//如果是input就直接在提交過程中將按鈕disable掉,如果是a可以用下面這種,當然解決根本問題還是後端驗證重復提交的好
varsub=false;
$(btn).click(function(){
if(sub===true){
return;
}
sub=true;
$.post(url,function(){
//TODO
sub=false;
})
});

『陸』 JS WEB前端開發如何防止重復提交的實現方

定義一個變數。
var flag= 0;
如果flag=0 就讓提交
在提交後,數據沒有返回來前,將flag=1
數據返回來後再設置成0
這樣就能防止重復提交。非常有效。

『柒』 安卓開發 怎麼避免重復提交請求

web前端數據請求或者表單提交往往通過對dom的點擊事件來操作,但是往往因為認為點擊過快(少年手速挺快的嘛),或者因為響應等待使得用戶誤人為沒操作而重復很多次點擊,造成表單數據的連續重復提交,造成用戶體檢的不好,甚至影響到整個系統的安全性。而前端的防治重復提交至少很有效的防治了人為正常操作下的很多不必要麻煩。下面就來講講如何有效避免前端的表單重復提交 表單提交有以下幾種方式: <form name=」form」 method=」post」 action=」#"> <input type=」submit」 name=」submit」 value=」提交"> </form> 另外,還有一種常用的方法是使用圖片: 代碼如下: <form name=」form」 method=」post」 action=」# "> <input type=」image」 name=」submit」 src=」btnSubmit.jpg」> </form> 第三種是使用鏈接來提交表單,用到了javascript的DOM模型: 代碼如下: <form name=」form」 method=」post」 action=」#」> <a href=」javascript:form.submit();」>提交</a> </form> 實際上這一種是通過js 進行提交。可以理解成 $("form").find("a").click(function(){ $("form").submit(); }); 第一種和第二種可以用js來: $("input[type='submit']").click(function(){ $("form").submit(); }); $("input[name='submit']").click(function(){ $("form").submit(); }); 總之,都是對form進行提交,當然還有出了表單提交還有些請求也要防治重復,比如響應某個事件的ajax請求(提交數據) $.ajax({ url: url, type: "post", data: data, success: function (data) { callback; } }); 那麼前面這些提交和請求在網路和性能因素上導致不能及時網路響應並且在事件多次響應時造成的重復,除非在提交響應完成前的點擊(觸發事件)視為無效,等當前響應完了再去響應下一個請求 如果是表單按鈕我們可以這樣在點擊後將按鈕disabled掉 $("input[type='submit']").click(function(){ $(this).attr("disabled",true); $("form").submit(); }); 按道理來說,將點擊後將按鈕disabled設為true時按鈕就不能點擊了那麼第二次以後點擊就無效了,但這樣做你會發現同時第一次點擊的表單也無法正常提交了(好像是h5的標准後才不行的,無論怎樣h5標準的瀏覽器我試了試都不行),看來是disabled影響了表單的提交,那麼先提交後disabled看行不行 $("input[type='submit']").click(function(){ $("form").submit(); $(this).attr("disabled",true); }); 實驗結果 ,這樣也不行,我們不能猜想submit()回調在click函數最後執行並且.submit()函數內部應該對disabel做了判斷(假設這是瀏覽器內部機制原理),反正在當前這個交互周期里disabled了就不能submit 那麼我們可以拋開disabled用代碼邏輯來防治重復 $("input[type='submit']").click(function(){ if(!$(this)[0].repeat){ $(this)[0].repeat=true; $("form").submit(); } }); 在當前點擊的按鈕如果沒有repeat的話就進入提交並且設置個值為true的repeat屬性,當第二次進來的時候發現有這個屬性就不提交,看似這樣的邏輯會防治重復提交了,但是事實永遠都是殘酷的! 是的,當點擊過快的時候還是會重復提交,這是因為,如果click里沒執行submit的時候html默認的type=submit 的input點擊操作會提交表單,舉個完整的例子 <form name=」form」 method=」post」 action=」#"> <input type=」submit」 name=」submit」 value=」提交"> </form> <form name=」form」 method=」post」 action=」#"> <input type=」submit」 name=」submit」 value=」提交"> </form> $("input[type='submit']").click(function(){ console.log("here is click too!"); }); <form name=」form」 method=」post」 action=」#"> <div>提交</div> </form> $("form").find("div").click(function(){ $("form").submit(); }); 這三個代碼都是一個效果提交表單,但是!!!!!!!!!!我們發現阻止表單提交的不就是在當前交互周期(一次點擊-》響應-》回調)里,將submit按鈕disabled掉嗎,好的,少年上代碼 $("form").find("div").click(function(){ if(!$(this)[0].repeat){ $(this)[0].repeat=true; $(this).closest("form").submit(); }else{ $(this).attr("disabled",true); } }); 看到沒有,第二次點擊的時候就disabeld掉了,所以只有第一次成功,第二次的就不會提交了! 當然,如果是其他dom元素防治重復點擊那就更簡單了 $("div").click(function(){ if(!!$(this)[0].isRepeat){ return; } $(this)[0].isRepeat=1; $.ajax({ url: url, type: "post", data: data, success: function (data) { $(this)[0].isRepeat=0; callback; } }); }); 因為submit()會刷新試圖,而ajax不會,所以在回調後需要把判斷重復的那個屬性賦值為false 這是不是就更簡單?我想你會這樣認為的! 以上所述是小編給大家介紹的JS WEB 前端開發中防治重復提交的實現方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!

『捌』 jquery ajax如何防止多次提交

部分重要代碼:
$.ajax({
type:'post',
url:'LibraryBooks_data.php',
data:params,
dataType: 'json',
async:false, //這是重要的一步,防止重復提交的
success: function (a)
{
if(a.action=='ture'){
$.success('操作成功!');
}
}
});

默認設置下,所有請求均為async非同步請求。
如果需要發送同步請求,請將此async選項設置為 false。

注意,同步請求將鎖住瀏覽器,用戶其它操作必須等待請求完成才可以執行(默認: true) 默認設置下,所有請求均為非同步請求。如果需要發送同步請求,請將此async選項設置為 false。
注意,同步請求將鎖住瀏覽器,用戶其它操作必須等待請求完成才可以執行。

『玖』 JS Ajax請求如何防止重復提交

好長時間沒寫js代碼了剛好遇到這樣的問題。我們系統多數表單沒有做防止重復提交的。
由於不想在後端這邊處理,因為假如由後端處理的話,就需要在頁面載入的時候給出一次性的token值,加大了開發的工作量不說,還容易忘記做這個,同時,ajax也不好處理,需要提交失敗的話同時返回新的token值。
所以我想在,js這邊動手。其實以前和前端提過,久久不見動靜,就只好弄塊磚丟出去了。思路是,覆蓋掉$.ajax,在這裡面處理掉防止重復提交的問題,而前端的業務開發不受影響,不改代碼,無感知。
我想架構的目的之一,就在於簡化業務開發,屏蔽掉業務無關的細節,讓一線開發安心寫業務吧。
代碼如下:
/**
*
Created
by
xiayongsheng
on
2016/6/12.
*/
;(function($){
var
ajax
=
$.ajax;
//
用於存儲ajax的請求
var
ajaxState
=
{};
var
kinhomAjax
=
function
()
{
var
args
=
Array.prototype.slice.call(arguments,
0);
//
url
data
一致,
//
應該將
url取出,data按鍵值排序,後將值拼接在一起,進行sha1得到的值作為指紋
//
累先用
url作為指紋吧
var
hash
=
typeof
args[0]
===
'string'?args[0]:args[0].url;
if
(typeof
ajaxState[hash]
!==
'undefined')
{
if
(ajaxState[hash]
>
3)
{
alert('請不要重復提交,請求正在處理中');
}
++ajaxState[hash];
return
$.Deferred();
}
ajaxState[hash]
=
1;
var
def
=
ajax.apply($,args);
def.done(function
()
{
delete
ajaxState[hash];
});
return
def;
};
$.ajax
=
kinhomAjax;
})(jQuery);
以上所述是小編給大家介紹的JS
Ajax請求如何防止重復提交的相關知識,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!

『拾』 在java中怎麼防止頁面重復提交

1.新建兩個文件
index.jsp -- 表單頁面
success.jsp -- 結果提示頁面

2
2.代碼分別如下:

3
3.新建TokenServlet,代碼如下

4
4.運行index.jsp,輸入用戶名,點擊提交

5
5.正常跳轉結果頁面

6
6.但當我在這個頁面點擊刷新的時候,出現如下提示

7
7.點擊重試,發現又一次調用了servlet,這就是一個重復提交

8
8.多刷新幾次,注意看URL地址,現在仍然是servlet

9
9.以前說重定向可以解決表單重復提交的問題,我們修改Servlet代碼如下

10.再次測試,發現重定向到了success.jsp ,再點擊刷新的話也不會出現重復提交了

11.那問題解決了么?再看,當我點擊瀏覽器中的返回,然後再點擊提交,如此反復,仍然在重復調用Servlet,這也是重復提交

12.現在修改Index.jsp

13.修改servlet代碼

14.新建token文件,代碼如下

15.在瀏覽器中測試(注,這里如果再使用Eclipse自帶瀏覽器的話,會出現緩存問題,所以使用正常的瀏覽器火狐或者IE)

16.hidden中的token 和session中的token是相同的

17.當點擊瀏覽器中的後退按鈕,再次進行操作,發現不能重復提交

18.這是因為session中的token已經被移除掉了

19.而返回後刷新頁面,相當於新開一個index.jsp 重新獲取token 賦值給session,這時可以正常提交了