JavaScript

[JavaScript] フォームの二重送信を防止する

投稿日:2016年10月10日 更新日:

フォームの二重送信を防止するサンプルです。

ボタンを2回押したときに警告を表示するパターンと、 送信ボタンを使用不可にするパターンを紹介します。

二重送信を防止する(警告表示パターン)

例)送信ボタンを2回押したら、警告を表示する

解説

  • submitの直前に送信フラグをチェックして、フラグがtrueならばsubmitを中止し、falseならばフラグをtrueにした後にsubmitを実行します。
  • submitの結果が返ってきて画面が再描画されたり、ページ遷移してきた場合にはフラグはリセットされるので、またsubmitできるようになります。

二重送信を防止する(ボタン使用不可パターン)

例)送信ボタンを2回押したら、送信ボタンをDisableにする

解説

  • submitの直前に送信ボタンの使用可否をチェックして、使用不可ならばsubmitを中止し、使用可ならばボタンを使用不可にした後にsubmitを実行します。
  • submitの結果が返ってきて画面が再描画されたり、ページ遷移してきた場合にはボタンは使用可となるので、またsubmitできるようになります。

スポンサーリンク

スポンサーリンク

-JavaScript
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

[JavaScript] ダブルクリック イベントを取得する(onDblClick)

ダブルクリックイベントを取得するには、ondblclickイベントハンドラを使用します。 サンプルソース 例)ボタンをダ ...

[JavaScript] 例外処理

例外処理のサンプルです。 例外処理の構文 例外処理の構文と書き方サンプルです。 (構文) try{  //例外が発生する ...

[JavaScript] 小数点以下指定した桁数で四捨五入する(.toFixed)

小数点以下指定した桁数で四捨五入するには、.toFixed()を使用します。 サンプルソース 例)小数点以下指定した桁で ...

[JavaScript] ブラウザにインストールされているプラグインの情報を取得する(navigator.plugins)

ブラウザにインストールされているプラグインの情報を取得するには、window.navigator.plugins を使用 ...

[JavaScript] 郵便番号のハイフン編集を行うテキストボックス

フォーカスインするとハイフン無し郵便番号、 フォーカスアウトするとハイフン有り郵便番号にするテキストボックスサンプルです ...

スポンサーリンク