Question

我有一个表单，所以当用户点击编辑按钮然后文本替换为输入类型=“电子邮件”并且还匹配给定的电子邮件模式

               <label for="name-c">Email-Id:</label>
             <label class="email">abc@xyz.com</label>
                 <button class="edit">edit</button>

Jquery代码：

$('.edit').click(function () {
  var email=$('.email').text();
   $('.email').replaceWith(function () {
     var pattern = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,6}$/;
     return '<input type="email" id="email" name="email" title="Enter email like abc@xyz.com" required placeholder="abc@xyz.com"   pattern="' + pattern + '"'+'class="ui-input-text ui-body-c ui-corner-all ui-shadow-inset"/>'});
     $('#email').val(email);});

我收到错误消息请输入给定的模式，尽管它是正确的。但是当我通过简单放置input type="email"后跟模式进行匹配然后匹配。我完全混淆了我的代码不正确的地方。

Answer 1

我认为你不需要一个模式。当您指定type="email"时，它是控制值的导航器。我使用默认参数测试[here] [1]，它适用于chrome和firefox。但是当我添加一个像“。*”这样的模式时，检查失败就很奇怪了。

在W3C给出的规范中，它们允许属性模式，但是当您向下滚动到value时，它们将使用指定值进行检查。

因此您无需添加检查隐式的模式。

编辑：

试试这个正则表达式^ [a-zA-Z0-9。！＃$％＆amp;'* + / =？^ _`{|}〜 - ] + @ [a-zA-Z0-9-] +（？：。[a-zA-Z0-9 - ] +）+ $我采用w3c规范中定义的正则表达式，并将最终*更改为+。

编辑：

最后我发现错误实际上在你用jquery添加输入时错过了一个反斜杠解决方案http://jsfiddle.net/KaBut/6/

jquery中HTML5电子邮件的模式错误

1 个答案: