7

我是 HTML5 新手...

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

1）如果我在电子邮件字段中提供 user@gmail.com 之类的输入...

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

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

这是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>

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

4

7 回答 7

10

这应该是正确的模式

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

是的，你忘了考虑小写。

您可以参考此文档以获取更多详细信息

html5-form-validation-with-regex

于 2013-07-04T07:54:46.193 回答
10

接受的答案不会验证 marian@iflove.technology 在这种情况下，不要错过所有这些新域名电子邮件，例如http://www.iflove.technology/您可以使用：

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

与输入类型电子邮件一起使用，它看起来像这样：

<input type="email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,}">
于 2015-01-29T16:41:26.610 回答
4

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

^.+@.+$

并向他们应该遵循的地址发送一封确认电子邮件，因为电子邮件地址相当复杂，您最终会使用正则表达式阻止您不打算使用的内容，并且不会阻止有人输入假的电子邮件地址。

于 2013-07-04T07:52:17.023 回答
1

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

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

于 2014-09-24T08:44:59.830 回答
0

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

于 2016-01-04T19:18:56.560 回答
-1

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

[a-zA-Z0-9._\-]+@[a-zA-Z0-9.\-]+\.[a-zA-Z]{2,4}
于 2014-03-05T14:52:33.503 回答
-1

我的解决方案覆盖 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')
})
于 2016-01-04T19:08:33.767 回答