我想在提交表單後禁用表單以防止雙重提交。非常標準的用例我會想,但我可以發現的所有例子都有缺陷。使用javascript禁用表單以防止雙重提交
我能找到的所有東西都是基於禁用提交按鈕,但是這並不妨礙表單被重新提交,如果用戶在表單上敲入了回車鍵,這是一種非常常見的方法。
我正在考慮修改現有腳本之一來解決這個問題,但在重新發明輪子之前,有沒有人知道腳本已經正確處理了它們能夠共享的腳本?我真的很驚訝,那裏似乎還沒有任何東西。
我想在提交表單後禁用表單以防止雙重提交。非常標準的用例我會想,但我可以發現的所有例子都有缺陷。使用javascript禁用表單以防止雙重提交
我能找到的所有東西都是基於禁用提交按鈕,但是這並不妨礙表單被重新提交,如果用戶在表單上敲入了回車鍵,這是一種非常常見的方法。
我正在考慮修改現有腳本之一來解決這個問題,但在重新發明輪子之前,有沒有人知道腳本已經正確處理了它們能夠共享的腳本?我真的很驚訝,那裏似乎還沒有任何東西。
您可以創建布爾變量(或帶有布爾成員變量的對象),並且只在變量爲false時才提交表單。喜歡的東西:
function init() {
var submit = false;
var f = document.getElementById("FormID");
f.onsubmit = function() {
if(submit) {
return false;
} else {
submit = true;
return true;
}
}
}
當然,你得打個電話init
以下頁面加載無論是在哪個味道你選擇這樣做(window.onload = ...
,window.addEventListener(...)
,window.attachEvent(...)
等)。
我在解決方案時遇到了一些麻煩。從概念上講它很明顯,但是當我實施它時,實際上我似乎可以潛入一個額外的點擊,如果我儘可能快地反覆按下提交按鈕。就好像第二次提交是在第一次有時間將提交設置爲true之前啓動的。但是,當我堅持提醒時,一切似乎都按我的預期工作。 – 2010-09-01 02:19:00
奇怪的是,雙提交腳本完全對輸入鍵。它只使用鼠標點擊提交按鈕,雙柱仍然滑過。 – 2010-09-01 02:54:01
嗯,最後一塊信息,這個重複的提交鼠標問題不會發生在最新的Chrome或IE,只有最新的Firefox。也許我已經準備好接受這個作爲一個模糊的Firefox錯誤並將其寫下來。 – 2010-09-01 02:57:35
var sent = false;
$('#form').submit(function(e) {
if (!sent) {
sent = true;
// do whatever
}
else e.preventDefault();
});
我已經嘗試了很多解決方案,但他們沒有爲我工作。我用這一個,它是工作真的沒事:
jQuery的
<script>
$(document).ready(function(){
$('#buttonSubmit').click(function() {
if ($('#frm-confirm').attr('submitted')){
event.preventDefault();
} else {
$('#frm-confirm').attr('submitted',true);
}
});
});
</script>
HTML/PHP
<form id="frm-confirm" action="" method="post">
<input id="amount" name="amount" value="<?php echo round($_POST['amount'],2); ?>" type="hidden" />
<input id="order_id" name="order_id" value="<?php echo htmlspecialchars($_POST['order_id']);?>" type="hidden" />
<input type="submit" id="buttonSubmit" name="confirm" value="Confirm" />
</form>
是否有可能打表單上的回車鍵提交表單一旦所有形式元素被禁用?即如果表單沒有提交元素,可以通過按回車來提交?我不認爲你可以這樣做。 – Adam 2010-08-31 20:18:02
@Adam我想我可以禁用所有字段,但到目前爲止,我一直只禁用提交。這不是一個錯誤的想法,我可以走一切禁用的路線。 – 2010-08-31 20:22:09
可能重複的[防止jQuery中的雙重提交表單](http://stackoverflow.com/questions/2830542/prevent-double-submission-of-forms-in-jquery) – CmajSmith 2014-11-05 00:43:04