验证电子邮件时无法阻止表单提交答案

【问题标题】：Unable to stop form from submitting when validating an email验证电子邮件时无法阻止表单提交
【发布时间】：2016-03-17 08:40:58
【问题描述】：

我正在制作一个简单的表单，它从文本输入中获取值，检查电子邮件地址中的所有字符是否都存在并返回 true 或 false。根据很多不同的资源，如果它返回false，则不应该提交表单。但是，当我在 JS bin 中对其进行测试时，它会提交它。代码如下：

function validateEmail(x) {
  console.log(x);
  var email = x.myText.value;
  console.log(email);
  var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
  console.log(re.test(email));
}

<form name="myForm" onsubmit="return validateEmail(this)">
  <input name="myText" type="text">
  <input type="submit" value="Submit">
</form>

【问题讨论】：

标签： javascript forms validation

【解决方案1】：

如果验证失败则需要返回false，所以只需替换

console.log(re.test(email));

与

return re.test(email);

Demo

【讨论】：

【解决方案2】：

试试这个：

function validateEmail(x) {
  console.log(x);
  var email = x.myText.value;
  console.log(email);
  var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    return re.test(email);
}

【讨论】：

【解决方案3】：

更改 <form name="myForm" onsubmit="return validateEmail(this)">

有了这个<form name="myForm" onClick="return validateEmail(this)">

而且功能是这样的

function validateEmail(x) { console.log(x); var email = x.myText.value; console.log(email); var re = your regular expression; if((re.test(email)){ document.getElementById(myForm).submit(); }

【讨论】：