Html 电子邮件的 Html5 模式属性不匹配([email protected]

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17464404/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 10:44:58  来源:igfitidea点击:

Html5 pattern attribute not matching for email([email protected])

regexhtmlhtml-emailemail-validationhtml-input

提问by KVK_cool

I am new to HTML5...

我是 HTML5 的新手...

Here i am having some problem with email pattern attribute...

在这里,我在电子邮件模式属性方面遇到了一些问题...

1)if i am giving the input like [email protected]... in email field..

1)如果我在电子邮件字段中提供像 [email protected]... 这样的输入..

2)it's not accepting value and showing "Pattern not matched"..

2)它不接受值并显示“模式不匹配”​​..

Help me to fix this....

帮我解决这个问题......

Here is the snippet of Html

这是Html的片段

<form name='f1' method="POST" action=""  >     
  <div id="fp">


        <span style="margin-left:-50px">Email:</span>&nbsp;&nbsp;
        <span><input  class="input" type="email" name="Email" placeholder="Enter mailID" required pattern="^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$" ></span><br>


         <input type="submit"  name="submit" value="submit">

   </div>
  </form>    

Any suggestions are acceptable....

任何建议都是可以接受的......

回答by Ashish Chopra

this should be correct pattern

这应该是正确的模式

[^@]+@[^@]+\.[a-zA-Z]{2,6}

yes you forgot to consider lower case.

是的,你忘了考虑小写。

you can refer this document for more details

你可以参考这个文件了解更多细节

html5-form-validation-with-regex

html5-form-validation-with-regex

回答by Marian Zburlea

The accepted answer won't validate [email protected] In this case not to miss out all those new domain names emails like http://www.iflove.technology/you could use:

接受的答案不会验证 [email protected] 在这种情况下,不要错过所有像http://www.iflove.technology/这样的新域名电子邮件,您可以使用:

[^@]+@[^@]+\.[a-zA-Z]{2,}

Used with input type email it looks like this:

与输入类型的电子邮件一起使用,它看起来像这样:

<input type="email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,}">

回答by ydaetskcoR

You need to account for lower cases too. Or make it case insensitive. But in reality you should just use:

您也需要考虑小写。或者让它不区分大小写。但实际上你应该只使用:

^.+@.+$

And send a confirmation e-mail to the address that they should follow because e-mail addresses are reasonably complicated and you'll end up blocking stuff you don't intend to with a regex and it doesn't stop someone putting in a fake e-mail address anyway.

并将确认电子邮件发送到他们应该关注的地址,因为电子邮件地址相当复杂,您最终会使用正则表达式阻止您不打算使用的内容,并且不会阻止某人输入假冒电子邮件地址。

回答by sambatha

It is very difficult to validate Email correctly simply using HTML5 attribute "pattern". If you do not use a "pattern" someone@ will be processed. which is NOT valid email.

仅使用 HTML5 属性“模式”很难正确验证电子邮件。如果您不使用“模式”,某人@ 将被处理。这不是有效的电子邮件。

Using pattern="[a-zA-Z]{3,}@[a-zA-Z]{3,}[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,}" will require the format to be [email protected]

使用模式="[a-zA-Z]{3,}@[a-zA-Z]{3,}[.]{1}[a-zA-Z]{2,}[.]{1} [a-zA-Z]{2,}" 将要求格式为 [email protected]

回答by Josef Kufner

Simply remove the patternattribute. The type="email"is enough.

只需删除该pattern属性。该type="email"是足够了。

回答by Hiep Dinh

My solution to override html5 validation type='email'. I run this code after DOM loaded

我的解决方案是覆盖 html5 验证 type='email'。我在加载 DOM 后运行此代码

$(document).ready(function(){
  $('input[type=email]').attr('pattern', "^([\w]+[\.]{0,1})+@([\w-]+\.)+[\w]{2,4}$").attr('type', 'text').attr('title', 'Please enter an email address')
})

回答by user3384066

I'm using this pattern right now, seems to work just fine:

我现在正在使用这种模式,似乎工作得很好:

[a-zA-Z0-9._\-]+@[a-zA-Z0-9.\-]+\.[a-zA-Z]{2,4}