javascript - 未正确检索重音字符

Question

我今天遇到了这个奇怪的问题。我们的页面中有一个电子邮件字段，如果用户输入:
Specialcharacter123@eñe.es

然后只有在 Chrome 的情况下我才得到 <a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ed9e9d888e848c818e858c9f8c8e99889fdcdfdead9583c0c08888c097878cc3889e" rel="noreferrer noopener nofollow">[email protected]</a> :

我尝试过:

jQuery('#email').val()  

和

document.getElementById('email').value    

两者都给了我相同的结果。 (它在 Safari 中工作正常)。

我的页面中已经有这个:

<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  

我无法得到任何线索这里出了什么问题。

Answer 1

根据w3.org关于input type=email – 电子邮件地址输入控件:

Value: Any string that matches the following [ABNF] production:

1*( atext / "." ) "@" ldh-str 1*( "." ldh-str )

…where atext is as defined in [RFC 5322], and ldh-str is as defined in [RFC 1034].

That is, any string which matches the following regular expression:

/^[a-zA-Z0-9.!#$%&’+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)$/

来源:https://www.w3.org/TR/2012/WD-html-markup-20120329/input.email.html

从上面的正则表达式可以看出，输入的值不能包含非ascii字符。这是有问题的，因为电子邮件地址有时确实包含非 ASCII。 Chrome 所做的只是(愚蠢地)对电子邮件地址的域部分进行 punycode 编码，以便它能够满足 w3c 的要求。他们应该做的就是不管它，因为不言而喻，表单验证应该接受用户的输入或拒绝它，但永远不要更改它。