フォームのダブルクリックをシンプルに防止してみた

Googleフォームをカスタマイズして作ったフォームの結果を追いつつ、フォームのサブミットボタンをダブルクリックする人が沢山いるということに驚かされました。

フォーム作成コストを削減! Googleフォームをカスタマイズしました。

まあ、データ整理で重複した回答を消せばいいだけだが、消していくと最初にだした結果の1/3になるんじゃないかくらいの重複があり、あまりに無意味に思えたので、Javascriptでシンプルに制御することにしました。

考えられる方法としては

  • 回答者の情報を取得し、同一回答者の回答を防止する。
  • サブミットされた瞬間にサブミットボタンを使用不可にする。
  • サブミットボタンがクリックされた瞬間にCSSでポインターイベントを無効にする 等

フォームのダブルクリックをシンプルに防止してみた

で、今回実行した処理は2つ目。

サブミットされた瞬間にサブミットボタンを使用不可にする

【DEMO】jQueryでフォームのダブルクリックを防止したい

上記、デモサイトを作成したので、確認してみてください。

処理としてはとてもシンプルで、そのまま。

サブミットされた瞬間に disabled を付与する。

そして何らかのエラーでサブミットされなかった際に、サブミットに disabled がついたままだと不親切なので、一定時間後に消す処理をしました。

webサイトの制作、お任せください。

あくまでも基本料金になりますので、まずはご連絡ください。

コーディング

トップページ
(ヘッダー・フッター含む)

¥8,000~

コンテンツページ(1P)
(ヘッダー・フッター含まない)

¥4,000~

ランディングページ

¥15,000~

※アニメーションはオプション料金

デザイン

トップページ
(ヘッダー・フッター含む)

¥20,000~

コンテンツページ(1P)
(ヘッダー・フッター含まない)

¥5,000~

ランディングページ

¥20,000~

※コーディングとのセット料金

サイト構築

10ページ
(お問合せページを含まない)

¥100,000~

20ページ
(お問合せページを含まない)

¥175,000~

Wordpress導入

(上記)+¥50,000~

※お問合せページは¥10,000~