电子邮件的HTML5表单验证

Question

这是我以前没有注意到的问题。

<label> Email Address </label>
<input type="email" id="emailAddress" required placeholder='Email Address' />
<button type="submit" class="button primary small">Submit</button>

在我的JS文件中，我使用checkValidity()检查它的验证。

checkValidEmail: function(event){
  var emailAddress = $('#emailAddress');
  if(emailAddress[0].checkValidity()){
    console.log('Valid');
  } else{
    console.log('Not Valid');
  }
}


"keyup #emailAddress": "checkValidEmail" // KeyUp works as expected

Output:
  'a@b' // Valid

我不明白这种行为。据我所知，@.com是输入电子邮件的标准。

请注意:我尝试在多个网站上使用表单，它显示相同的输入。在上述情况下，我将在chrome浏览器上执行此操作。

谢谢您抽出时间来回复！

Answer 1

如果要使用正则表达式验证，请继续阅读。

http://www.regular-expressions.info/email.html

请注意，下面是100%有效和工作的电子邮件地址:-)经常使用它来测试错误实现的电子邮件验证

xn--80a1acny@xn--80auew.xn--j1amh

另一种选择是检查电子邮件地址域名是否有效。这样做，您可以查询DNS服务器的MX记录(这一个指向SMTP服务器负责接收传入的邮件)。您需要服务器端代码才能做到这一点。

Answer 2

在HTML5中，您可以像这样验证电子邮件

<form>
    <input type="email" placeholder="Enter your email">
    <input type="submit" value="Submit">
</form>