javascript 使用 HTML5 验证多个电子邮件地址
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19230897/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Validate Multiple Email Addresses with HTML5
提问by Ben McCormick
I'm trying to construct an email form that takes multiple comma separated emails as an input and verifies them using HTML5. I want to use the following regex to sanity check the input:
我正在尝试构建一个电子邮件表单,该表单将多个逗号分隔的电子邮件作为输入并使用 HTML5 验证它们。我想使用以下正则表达式对输入进行完整性检查:
\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}\b
Here's what I've tried
这是我尝试过的
This doesn't seem to work for more than one:
这似乎不只适用于一个:
<input type="email" pattern="\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}\b" value="" multiple>
This works, but only does the built in email validation, which seems to be something like .+@.+
.
这有效,但仅适用于内置的电子邮件验证,这似乎类似于.+@.+
.
<input type="email" value="" multiple>
Is there a way to mix pattern and multiple so the regex checks each item in the comma separated list?
有没有办法混合模式和多个,以便正则表达式检查逗号分隔列表中的每个项目?
I have a demo here: http://codepen.io/ben336/pen/ihjKA
我在这里有一个演示:http: //codepen.io/ben336/pen/ihjKA
回答by Ryan
Try this:
试试这个:
<input type="email" multiple pattern="^([\w+-.%]+@[\w-.]+\.[A-Za-z]{2,4},*[\W]*)+$" value="">
Update:
更新:
Using <input type="email" value="" multiple>
does seem to be bugged by letting "a@b" pass. Though I would go with this method to keep the semantics as you said, and simply use validation on the server side as well just in case someone tries to submit an email like "a@b".
<input type="email" value="" multiple>
通过让“a@b”通过似乎确实会干扰使用。尽管我会使用这种方法来保持您所说的语义,并且只需在服务器端使用验证,以防万一有人尝试提交像“a@b”这样的电子邮件。
Just as a note, you should always validate on the server side for security reasons anyway, as client side validation can be bypassed very easily.
请注意,出于安全原因,您应该始终在服务器端进行验证,因为客户端验证可以很容易地绕过。
回答by Mike Samuel
Is there a way to mix pattern and multiple so the regex checks each item in the comma separated list?
有没有办法混合模式和多个,以便正则表达式检查逗号分隔列表中的每个项目?
Yes. If the regex to match an element is foo
, then
是的。如果匹配元素的正则表达式为foo
,则
^(?:foo(?:,(?!$)|$))*$
will match a comma separated list of foo
s.
将匹配逗号分隔的foo
s列表。
The separator is (?:,(?!$)|$)
which will match either a required comma that does not end the input, or the end of input.
分隔符(?:,(?!$)|$)
将匹配不以输入结尾的必需逗号或输入结尾。
That separator is horribly ugly, but allows you to avoid duplicating the "foo
" as long as no suffix of the separator is a required non-empty prefix of the body.
该分隔符非常丑陋,但允许您避免重复“ foo
”,只要分隔符的后缀不是正文所需的非空前缀。
回答by Justin
You could read the input in with javascript and split the input on commas.
您可以使用 javascript 读取输入并将输入拆分为逗号。
function() {
var inputString = document.getElementById('emailinput').value;
var splitInput = inputString.split(',');
var pattern = /"your regex pattern"/;
var match = true;
for(i=0;i<splitInput.length;i++) {
if(!splitInput.match(pattern)){
match = false;
}
}
return match;
}