javascript - 表单提交前的字段验证

标签 javascript html

我需要验证表单中的电子邮件地址,但需要在验证电子邮件地址后提交表单。所以,真的,我需要一种调用一些 Javascript 的方法,它说“是的,你的电子邮件是有效的(因为其中包含你要查找的所有常用内容),然后提交表单。我没有办法绕过它,我需要表单提交到表单标题中的操作。

<html>
<head>
<script>

</script>
</head>
<body>

<form method="post" action="/captiveportal-test.php">
   <input name="email" type="text">
   <input name="redirurl" type="hidden" value="$PORTAL_REDIRURL$">
   <input name="mac" type="hidden" value="$CLIENT_MAC$">
   <input name="ip" type="hidden" value="$CLIENT_IP$">

   <input name="accept" type="submit" value="Continue">
</form>

</body>
</html>

有没有人知道我如何验证电子邮件地址,如果电子邮件地址包含 @ 符号,则提交(以便所有帖子值都通过指定的操作)?

谢谢

最佳答案

另一种解决方案

<!-- HTML -->
<form method = "post" action = "/captiveportal-test.php">
   <input name = "email" type = "text">
   <input name = "accept" type = "submit" value = "Continue">
</form>
// JavaScript
window.onload = function(){
  var form = document.forms[0],
      pattern = /^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$/; 
  form.onsubmit = function(){
    if(!pattern.test(form.email.value)){
      alert("Invalid email"); 
      return false;
    }
  };
};

Working jsBin

关于javascript - 表单提交前的字段验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25705909/

相关文章:

javascript - 在 promise 履行后触发 $ngAnimate enter

javascript - Promise 中的处理如何在需要解析之前触发,就像 java Future 一样?

javascript - 在一页上一次显示所有 "title"工具提示

html - 防止在可拖动元素内拖动子元素

javascript - 如何防止 IFRAME 重定向顶级窗口

javascript - MaterializeCSS 在 Google 脚本网络应用程序的第二条记录后添加 ","(逗号)

javascript - 我如何获得原始值的引用?

javascript - Easeljs Tweenlite 绕中心旋转

html - 在 Rails 的 label_tag 中包含表单元素

html - 位置粘在头上