HTML5电子邮件输入模式属性 [英] HTML5 Email Input Pattern Attribute

问题描述

我试图制作一个包含一个电子邮件输入，一个复选框输入和一个提交输入的html5表单。
我试图为电子邮件输入使用模式属性，但我不知道要在该属性中放置什么。我知道我应该使用一个必须与JavaScript Pattern生产相匹配的正则表达式，但我不知道如何做到这一点。

我是什么尝试获取此属性的方法是检查以确保电子邮件包含一个@和至少一个或多个点，如果可能，请检查@后面的地址是否是真实地址。如果我不能通过这个属性做这个，那么我会考虑使用JavaScript但是为了检查一个@和一个或多个点我确实想要使用pattern属性。

pattern属性需要检查：

1. 只有一个@


2. 一个或者更多点


3. 如果可能，请检查@后的地址是否为有效地址

这一个的替代方法是使用JavaScript，但是对于所有其他条件，我不想使用JavaScript 解决方案

这是一个双重的问题（在www世界中很多）。

您需要评估浏览器是否支持html5（我使用Modernizr来完成）。在这种情况下，如果你有一个正常的表单，浏览器将为你完成这项工作，但是如果你需要ajax / json（就像很多日常用例一样），你还是需要手动验证。

..所以，我的建议是在提交之前随时使用正则表达式进行评估。我使用的表达式如下：

  var email：/^[a-z0-9._%+-]+ @ [A-Z0-9 .-] + \ [AZ] {2,4} $ /。 
  

这个来自 http://www.regular-expressions.info/ 。这是一个很难理解和掌握的世界，所以我建议你仔细阅读本页。

I’m trying to make a html5 form that contains one email input, one check box input, and one submit input. I'm trying to use the pattern attribute for the email input but I don't know what to place in this attribute. I do know that I'm supposed to use a regular expression that must match the JavaScript Pattern production but I don't know how to do this.

What I'm trying to get this attribute to do is to check to make sure that the email contains one @ and at least one or more dot and if possible check to see if the address after the @ is a real address. If I can't do this through this attribute then I'll consider using JavaScript but for checking for one @ and one or more dot I do want to use the pattern attribute for sure.

the pattern attribute needs to check for:

1. only one @
2. one or more dot
3. and if possible check to see if the address after the @ is a valid address

An alternative to this one is to use a JavaScript but for all the other conditions I do not want to use a JavaScript

解决方案

This is a dual problem (as many in the www world).

You need to evaluate if the browser supports html5 (I use Modernizr to do it). In this case if you have a normal form the browser will do the job for you, but if you need ajax/json (as many of everyday case) you need to perform manual verification anyway.

.. so, my suggestion is to use a regular expression to evaluate anytime before submit. The expression I use is the following:

var email: /^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$/;

This one is taken from http://www.regular-expressions.info/ . This is a hard world to understand and master, so I suggest you to read this page carefully.

这篇关于HTML5电子邮件输入模式属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！