Polyfills作为表单验证，html5里面关于表单的知识点！

如前所述在之前的章节,并不是所有的浏览器和平台支持新的令人兴奋的特性的HTML5的表单验证。因此可以派上用场polyfills他们改进用户体验的网站。

h5validate由Eric引领

埃里克领导创建了一个非常有用的polyfill增加支持所需的属性和模式属性程度是由下面的桌面平台:IE 9、8、7、6、Chrome,Firefox,Safari和Opera和下面的移动平台:iPhone,Android,Palm WebOS

循序渐进的指导

首先,你必须下载polyfill

然后你要上传的JavaScript文件,jquery.h5validate.js,您的网络服务器

然后你要复制并粘贴以下代码到结束的身体在任何页面,该页面使用HTML5表单(并确保jquery.h5validate的路径。js是正确的——您可能已经上传文件到一个特定的文件夹,然后你将不得不更改路径)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="jquery.h5validate.js"></script>

<script>
$(document).ready(function () {
$('form').h5Validate();
});
</script>

第一个脚本元素在第一线加载一个jQuery和JavaScript库称为第二个脚本元素在第二行加载h5validate polyfill。现在您已经加载了资源在您的页面最后的脚本创建的连接代码和你的表单元素polyfill。

现在,每当你使用所需的属性表单是支持在所有之前提到的平台。此外,还支持pattern属性在所有之前提到的平台。记住:当使用pattern属性你必须实际上定义了一个模式。你可以如使用pattern属性来验证电子邮件地址或验证日期。

html5 widgets by Zoltan Hawryluk

佐尔坦•Hawryluk polyfill已经创建了一个非常全面,将解决你的任何allmost html5表单的问题——它使用Modernizr来检测是否存在原生支持html5的每个表单元素,如果没有html5widget步骤。