即使我在某个字段中检测到错误，也可以提交表单

Question

我在提交之前使用 javascript 来验证表单。当我在某个字段上检测到错误时，表单仍然会发布。如何防止错误提交？

这是我的表格：

    <form onSubmit="return validateForm()" action="send.php" method="post"  name="formulaire">
        Prénom: <input type="text" name="prenom"><p id="valider_prenom"></p><br>
        Nom: <input type="text" name="nom"><p id="valider_nom"></p><br>
        Email: <input type="text" name="email"><p id="valider_email"></p><br>
        Code postal: <input type="text" name="codepostal"><p id="valider_codepostal"></p><br>
      <INPUT type="submit" value="Envoyer">
    </form>

Here's my javascript function:

<script type="text/javascript">
    function validateForm()
    {
      var prenom = document.forms["formulaire"]["prenom"].value;
      var nom = document.forms["formulaire"]["nom"].value;
      var email = document.forms["formulaire"]["email"].value;
      var codepostal = document.forms["formulaire"]["codepostal"].value;
      var erreur = false;

      // Pour la validation du format de email
      var atpos = email.indexOf("@");
      var dotpos = email.lastIndexOf(".");

      if (prenom == null || prenom == "")
      {
        document.getElementById('valider_prenom').innerHTML = '* Requis';
        erreur = true;
      }

      if (nom == null || nom == "")
      {
        document.getElementById('valider_nom').innerHTML = '* Requis';
        erreur = true;
      }

      if (email == null || email == "")
      {  
        document.getElementById('valider_email').innerHTML = '* Requis';
        erreur = true;
      }
      else if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= email.length)
      {
        document.getElementById('valider_email').innerHTML = '* Adresse incorrect';
        erreur = true;
      }

      if (codepostal == null || codepostal == "")
      {
        document.getElementById('valider_codepotal').innerHTML = '* Requis';
        erreur = true;
      }

      if (erreur){return false;}
    }
  </script>

Answer 1

如果您将代码的最后一行替换为 if (erreur == true){return false;} 它将验证您的表单。