試圖停止從頁面加載自動提交按鈕

Question

我有一個頁面有一系列的輸入，類似於一個窗體，但沒有。按提交後，我想運行我的函數submitForm（）。但是，每次頁面加載時，它都會自動點擊提交。關於如何阻止這種情況發生的任何想法？

JS：

function submitForm(){ 
    // Initiate Variables With Form Content 
    var fname = document.getElementById(name).value(); 
    var femail = document.getElementById(email).value(); 
    var fmessage = document.getElementById(message).value(); 


    $.ajax({ 
     type: "POST", 
     url: "cgi-bin/process.php", 
     data: "name=" + fname + "&email=" + femail + "&message=" + fmessage, 
     success : function(text){ 
      if (text == "success"){ 
       formSuccess(); 
     } 
    } 
    }); 
} 
function formSuccess(){ 
    $("#msgSubmit").removeClass("hidden"); 
} 

$(function() { 
    $("#btnContact").on("click", submitForm()); 
}); 

我的任何HTML：

<div class="row"> 
    <label for="name" class="h4">Name</label> 
    <input type="text" class="form-control" id="name" placeholder="Enter name" 
     required=""> 
    <label for="email" class="h4">Email</label> 
    <input type="email" class="form-control" id="email" placeholder="Enter email" 
    required=""> 
    <label for="message" class="h4 ">Message</label> 
    <textarea id="message" class="form-control" rows="5" placeholder="Enter your message" 
    required=""></textarea> 
    </div> 
    <button id="btnContact" type="submit">Send Message</button> 
    <div id="msgSubmit" class="h3 text-center hidden">Message Submitted!</div> 
</div> 

Answer 1

從你的最後陳述中取出()。

s/submitForm\(\)/submitForm/。

您實際上正在調用該函數。

http://jsfiddle.net/fx6hefe4/

看起來就像這樣：

$(function() { $("#btnContact").on("click", submitForm); });

Answer 2

Working fiddle。

您的代碼經過多次更改後可以使用。

1. 替換：

   var fname = document.getElementById(name).value(); 
   var femail = document.getElementById(email).value(); 
   var fmessage = document.getElementById(message).value(); 
   

   通過：

   var fname = document.getElementById('name').value; 
   var femail = document.getElementById('email').value; 
   var fmessage = document.getElementById('message').value; 
   

2. 替換：

   $("#btnContact").on("click", submitForm()); 
   

   通過：

   $("#btnContact").on("click", function(){ 
       submitForm(); 
   }); 
   

3. 替換：

   <button id="btnContact" type="submit">Send Message</button> 
   

   通過：

   <button id="btnContact" type="button">Send Message</button> 
   

希望這有助於。