Javascript:表单在第一次验证和应用样式后提交

Javascript: Form submits after first validation and after applying styles

本文关键字：应用 样式 提交 验证 表单 第一次 Javascript      更新时间：2023-09-26

Am试图阻止某些用户ID通过电子邮件提交表单，例如黑名单denieduser1@domain.com并接受denieduser1，当用户提交表单时，会出现一个引导程序警报，说有问题，问题是如果你再次点击按钮，表单就被提交了，而没有再次进行验证，如果我删除了应用样式的部分并使用了警报，那么它就可以工作了，所以这里的代码是：

对于表格：

<form id="contact" method="post" class="form" role="form" onsubmit="return validate()" action="m41lS3nd.php">

验证代码：

    function validate(){
    e.preventDefault;
var rejectList = [ "denied1" , "denied2" ]; //List of Blacklisted emails or domains
var emailValue = $('#email').val(); // To Get Value (can use getElementById)
var splitArray = emailValue.split('@'); // To Get Array
if(rejectList.indexOf(splitArray[0]) >= 0) //Check if contains any unwanted emails
{
// Means it has the rejected domains
document.getElementById("notification").style.display = "block"; //If unwanted emails are detected will show an alert
document.getElementById("notification").style.marginTop = "5px";
return false;
}else
var contactform = document.getElementById("contact"); //If good email is entered then get the form name and submits the form
contactform.submit();
return true;
}

引导程序警报：

<!--Notification for invalid emails such as spam or unsolicited emails-->          
  <div id="notification" class="alert alert-warning alert-dismissible fade in" role="alert" style="display: none;">
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
  <span aria-hidden="true">&times;</span>
  </button>
  <strong>Oops!</strong>There is something wrong with your email, your reference code is: BL1SE.
  </div>

提交按钮：

<button class="btn btn btn-md" type="submit">Send Message &nbsp;<i class="fa fa-paper-plane fa-1x" style="color: white;"></i></button>

我接受了代码并改编自这篇文章，但无法发表评论或联系作者，也不知道哪里做错了：验证代码

您的Javascript语法似乎不正确，因为e.preventDefault();引用了一个不存在的变量。我怀疑您的Javascript控制台正在报告错误。

我还强烈建议在else之后适当添加{}。我想这不会像你想的那样。格式化以显示差异：

  } else
    var contactform = document.getElementById("contact"); 
  contactform.submit();
  return true;

与相比

  } else {
    var contactform = document.getElementById("contact"); 
    contactform.submit();
  }
  return true;

如果您添加了另一个不返回的else/if条件，那么您将在不声明和初始化contactform的情况下达到contactform.submit();。

相关文章：