通過使用Javascript發生的停止窗體操作

Question

如何使窗體action =「connect.php」在我的函數內停止？我做到了這一點，如果輸入錯誤，然後返回一個錯誤;但是，如果沒有錯誤返回，那麼action =「connect.php」發生，但我不知道如何使action =如果出現錯誤，則會發生「connect.php」。我如何使它停止，並且不去connect.php？

HTML：

<form action="connect.php" method="get" name="registerForm"> 
      <h3>Not a member yet? Sign Up!</h3> 
      <p>Username:</p><input type="text" name="name" id="registerinput_username"> 
       <div id="usernamereq2"><p>Field is required.</p><img src="ximg.png" alt="x"></div> 
      <p>Email:</p><input type="text" name="email" id="registerinput_email"> 
       <div id="emailreq"><p>Field is required.</p><img src="ximg.png" alt="x"></div> 
      <p>A password will be e-mailed to you.</p> 
      <input type="submit" name="submit" value="Register" id="registersubmit"> 
</form> 

的JavaScript和jQuery：

$("#registersubmit").click(function(){ 
     if($("#registerinput_username").val() == "" || $("#registerinput_email").val() == "") 
     { 
      if($("#registerinput_username").val() == "") 
      { 
       $("#usernamereq2").css({ 
       opacity:'1' 
       }); 

      } 
      if($("#registerinput_email").val() == "") 
      { 
       $("#emailreq").css({ 
       opacity:'1' 
       }); 
      } 
     } 
     if($("#registerinput_username").val() != "") 
     { 
      $("#usernamereq2").css({ 
      opacity:'0' 
      }); 
     } 
     if($("#registerinput_email").val() != "") 
     { 
      $("#emailreq").css({ 
      opacity:'0' 
      }); 
      checkContinue(); 
     } 
     if($("#registerinput_email").val() != "" && $("#registerinput_username").val() != "") 
     { 
      validateFormRegister(); 
     } 
    }); 

function validateFormRegister() 
    { 
     var email=document.forms["registerForm"]["email"].value; 
     var atpos=email.indexOf("@"); 
     var dotpos=email.lastIndexOf("."); 
     var name=document.forms["registerForm"]["name"].value; 
     var x=name.length; 
      if(atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length) 
       { 
       alert("Email is invalid."); 
       } 
      if(x<5) 
       { 
       alert("Username is too short! Must be at least 5 characters."); 
       } 
    } 

Answer 1

您可以使用preventDefault()以阻止發生一個defult事件：

$("#registersubmit").click(function(e){ 
    e.preventDefault(); 

當您完成驗證，你可以然後致電.submit()提交表格。

<!-- add id attribute t form --> 
<form action="connect.php" method="get" id="registerForm" name="registerForm"> 

// add submit() to actually submit form 
$("#target").submit(); 

Answer 2

在點擊事件的末尾添加event.preventDeafult（）：

$("#registersubmit").click(function(event){ 
    event.preventDeafult(); 
)}; 

Answer 3

你可以刪除submit類型上的按鈕，頁面加載，然後撥動它基於button和submit之間錯誤。

var button = $('#registersubmit'); 
button.prop('type','button'); 
var error = true; 

// perform error checking 
if(!error){ 
    button.prop('type', 'submit'); 
} 

http://jsfiddle.net/j9SN7/

Answer 4

可以使用的preventDefault停止提交。

$("#registersubmit").click(function(e){ 
    {form validation here} 
    if(form is invalid) 
     e.preventDefault(); 
    } 
}