javascript 送信ボタンの二度押しを防ぐ

javascript 送信ボタンの二度押しを防ぐ

javascriptで、送信ボタンの二度押しを防ぐサンプルコードを掲載してます。ブラウザはchromeを使用しています。

環境

  • OS windows10 pro 64bit
  • Apache 2.4.43
  • ブラウザ chrome 84.0.4147.105

二度押し防止

submit時に、disabledに指定することで二度押しを防ぎます。
※コード内の「return false」は、disabledを確認するためのもので実際に使用する場合は必要ありません。

実行結果

サンプルコード

以下は、
「submit」ボタンをクリックして、disabledにする
サンプルコードとなります。

※cssには「tailwind」を使用して、アロー関数で関数は定義してます。

1度しか実行されていないことが確認できます。

disabledにする処理をコメントアウトすると、何度も実行されることが確認できると思います。

実行結果