送信ボタンを1回押したら、2回目は押せないようにします。
Program
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>サンプル</title> </head> <body> <form onsubmit="this.btn.disabled=true;"> 注文内容:<input type="text" name="x"> <input type="submit" name="btn" value="送信"> </form> </body> </html>
HTML内にJavaScriptを書きたくない場合や、submitするときにJavaScriptで入力チェックなどの処理をしている場合などでは、以下のようにしてもよいです(jQuery使用)。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>サンプル</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> $(function(){ $("#form1").on("submit", function(){ // 何かいろいろ処理をして // ... // 最終的にsubmitするとき if ("何らかの判定") { // ボタンを使用不可能にする $("#btn1").prop("disabled", true); // submitする return true; } else { // submitしない return false; } }); }); </script> </head> <body> <form id="form1" action="order.php"> 注文内容:<input type="text" name="x"> <input type="submit" id="btn1" value="送信"> </form> </body> </html>
Demo
下はすでに1回クリックした後の状態です。送信ボタンがdisabledにされています。フォームは送信されません。