一鍵單擊后如何禁用提交按鈕？

Question

我在一個div內有此表格，在另一個div內有提交按鈕。

<div class="container1">
        <form name="reg-form" id="signup" action="" method="post">      
            <div class="sep"></div>
            <div class="inputs">
                <input type = "submit" id="submit" name="submitkey" value="GENERATE KEY" />
            </div>

        </form>         
    </div>

一鍵后如何禁用提交按鈕？ 我嘗試了所有找到的JavaScript代碼，但對我不起作用。 我不知道是否是因為表單位於div內，而提交按鈕位於另一個div內。 謝謝。

Answer 1

document.getElementById('signup').onsubmit = function() {
    document.getElementById('submit').disabled = true;
};

演示

該代碼應放在腳本下，或包裝在DOMContentLoaded / window.onload處理程序內。 確保您的HTML沒有重復的ID。

另外，如果在刷新頁面/提交表單后必須使按鈕保持禁用狀態，則將需要Cookie或服務器端會話。 這些方法都不是萬無一失的，這超出了我認為的問題范圍。

Answer 2

如果您有jquery，則可以使用以下代碼：

$('#signup').submit(function(){
    $('#submit').attr('disabled', 'disabled');
});