HTML5“模式”属性的Javascript后备

前端之家收集整理的这篇文章主要介绍了HTML5“模式”属性的Javascript后备前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用HTML5“模式”属性进行客户端验证(请不要告诉我有关服务器端验证的信息,我有这个).我想对使用没有“模式”支持的浏览器的用户使用Javascript或jQuery后备.有什么好办法呢?

这是一个示例输入元素:

<input type=tel name=contact[phone] id=phone required pattern=^(?:(?:\+?1\s*(?:[.-]\s*)?)?(?:\(\s*([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9])\s*\)|([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9]))\s*(?:[.-]\s*)?)?([2-9]1[02-9]|[2-9][02-9]1|[2-9][02-9]{2})\s*(?:[.-]\s*)?([0-9]{4})(?:\s*(?:#|x\.?|ext\.?|extension)\s*(\d+))?$>

解决方法

在表单(或任何地方)的提交事件中,使用其现有的模式属性对其进行验证.
var input = document.getElementsByName('contact[phone]')[0],isValid = input.value.search(new RegExp(input.getAttribute('pattern'))) >= 0;

jsFiddle.

您将首先检查浏览器兼容性,以查看它是否支持pattern属性.你可以用Modernizr做到这一点.

猜你在找的HTML5相关文章