お問い合わせフォーム、クリック後に送信ボタンを無効にする

Question

私は作業連絡フォームをダウンロードし、必要なものを追加しましたが、今修正する方法がわからないという別の問題があります。

フォームが送信された後でも、ボタンを数回クリックすると、複数のメールが私に送信されます。フォームが送信されたら、ボタンを無効にする必要があります。

HTML：

<button type="submit" id="form-submit" class="btn btn-success btn-lg pull-right ">Submit</button> 
<div id="msgSubmit" class="h3 text-center hidden"></div> 
<div class="clearfix"></div> 

そして、ここでは、JavaScriptがある：

$("#contactForm").validator().on("submit", function (event) { 
    if (event.isDefaultPrevented()) { 
     // handle the invalid form... 
     formError(); 
     submitMSG(false, "Did you fill in the form properly?"); 
    } else { 
     // everything looks good! 
     event.preventDefault(); 
     $("#form-submit").prop("disabled",true); 
     submitForm(); 
    } 
}); 

Answer 1

はこのように、提出フォーム上のボタンを無効にしますあなたの完全なアーキテクチャ jQueryのone関数を使用することはできますが、私はそれをお勧めしません。これは、ページを読み込むまで連絡フォームを1回だけ送信できることを意味するためです。私は何

はちょうど反対は（disabled属性またはクラスを削除する）か、私はボタンを無効にするであろうと、$("#form-submit").attr("disabled","disabled"); OR $("#form-submit").addClass("inactive")とあなたのCSSを使用して

#form-submit{ 
    pointer-events:none; 
    opacity:0.6; 
    /*etc etc*/ 
} 

とあなたのアヤックスリターンです。また、入力textarea値を空の文字列に設定します。

Answer 2

複数の物事がに応じて、ここで行うことができます。

$("#contactForm").validator().on("submit", function (event) { 
    if (event.isDefaultPrevented()) { 
     // handle the invalid form... 
     formError(); 
     submitMSG(false, "Did you fill in the form properly?"); 
    } else { 
     // everything looks good! 
     event.preventDefault(); 
     submitForm(); 
    } 
});