HTML5 电子邮件输入类型使用啥技术？

Posted 2023-02-22

【中文标题】HTML5 电子邮件输入类型使用啥技术？

【英文标题】：What technology does HTML5 email input type use?HTML5 电子邮件输入类型使用什么技术？

【发布时间】：2013-05-04 23:07:28

【问题描述】：

问题 1： 我在 html5 中看到了email input type， 即使我在浏览器中禁用我的 javascript 也能正常工作，那么它使用什么技术来验证？

问题 2： 另外，在萤火虫profiler中，我看到了ASP.NET的data-val-regex，又调用了Jquery，控制权是怎么转给那个的？那就是data-val-regex是JQuery的特性还是HTML的特性？

参考：

<div style="width:255px; height: 30px; float:left;"><input data-val="true" data-val-regex="Please&#32;enter&#32;valid&#32;email&#32;id" data-val-regex-pattern=".+\@.+\..+" />

【参考方案1】：

Data- 是 HTML5 规范中的自定义属性

自定义数据属性旨在存储私有的自定义数据 没有更合适的页面或应用程序 属性或元素。

这些属性不适用于以下软件 独立于使用属性的站点。

每个 HTML 元素都可以有任意数量的自定义数据属性 指定，具有任何值。

http://www.w3.org/html/wg/drafts/html/master/dom.html#embedding-custom-non-visible-data-with-the-data-*-属性

如果您想了解更多信息 http://html5doctor.com/html5-custom-data-attributes/

【参考方案2】：

答案 1：这是一个浏览器功能。一些浏览器可以读取输入的type 属性并做出相应的行为。例如，iPad 将为number 输入显示数字小键盘，并为email 输入显示带有@ 符号的特殊键盘。

答案 2：这是 Microsoft 不显眼的库的一项功能。基本上这些属性（都以data- 开头）是HTML5 有效属性，并在显示页面时收集，然后通过创建规则和方法桥接到jquery 验证。要获得更好的解释，您可以查看我的旧 answers on how to roll your own validation 之一，希望能让事情更清楚。