JavaScript表單提交問題

Question

我需要提交一個表單，但是在提交表單時，我需要它禁用按鈕，因為查詢需要運行幾秒鍾，並且使用此表單的人不了解加載頁面，因此他們將點擊5或6次該按鈕多次提交表單。 我在Chrome瀏覽器中有一種有效的方法，但是在IE中它提交了兩次，我知道為什么，但是我不知道如何使它同時適用於兩者。 這是表格行：

    <form method="post" id="submitItem" action="secondPage.php">

我已經嘗試過各種版本，例如使用onSubmit或其他相關思路，但是沒有用。 在IE中提交兩次的chrome中的“工作”解決方案是該表單調用和以下JS：

$( document ).on( "click", ".once-only", function(){
    $(".once-only").prop('disabled', true);
    $('form').submit();
});

“僅一次”類附加到了“提交”按鈕上，因此在單擊“提交”后，在兩個瀏覽器中都禁用了該按鈕，但是由於我在表單實例化行中使用了“ action ='....'”，因此它使用“ 。提交（）”。 Chrome不會使用操作提交，而僅使用“ .submit（）”提交。 有沒有辦法讓這個工作？ 我已經嘗試過將JS更改為使用函數或取出“ .submit（）”，甚至更改表格行中的內容的大組合，但是我還沒有弄清楚。 有任何想法嗎？ 每當我使用JS時，IE都給我帶來了這個網站的問題，AJAX在其他所有頁面上僅適用於chrome，所以我真的很討厭使用IE，但是超過半數的使用該網站的人甚至不知道chrome是什么。 有小費嗎？ 如果需要，我可以共享任何其他代碼！

Answer 1

嘗試這個：

$( document ).on( "click", ".once-only", function(event) {
  event.preventDefault(); //this should disable the default form submit action
  $(".once-only").prop('disabled', true);
  $('form').submit();
});

Answer 2

但在IE中，它會提交兩次

對於您可以先off或者取消綁定點擊之后on

// If the button is not dynamically generated , there is no need to delegate the event
$('.once-only).off('click').on( "click",function(event){
   // Rest of the code
})

第二期

您可以使用button type = "button"然后使用ajax代替form action

您也可以使用button type="submit"

$('.once-only').off('click').on( "click",function(event) {
  event.preventDefault(); //prevent default behavior 
  $(".once-only").prop('disabled', true);
   $.ajax({
    url:'some url'
    //Rest of code
    })
});

注意ajax也可以在IE中使用

Answer 3

編輯

或類似這樣： onclick="this.form.submit();this.enabled=false;"

---

所以真正的答案是這樣

onclick="setTimeout((function(){ this.disabled = true; }).bind(this),0);"

說明 ：指示瀏覽器稍后禁用按鈕； 由於JS在事件循環中工作，因此您需要排隊一個超時事件，該事件將在onclick事件之外進行。

我認為讓我做這招只是愚蠢的鉻。