html5 的 required 属性能够实现自动阻挡空内容提交。
当一个元素设置了required属性后,
在提交表单时如果这个元素的值为空,
浏览器会自动提示错误信息并阻止信息提交。
只有表单元素才支持 required 属性。
目前支持 required 属性的主流浏览器有Google Chrome, Firefox, Opera, IE10+
使用以下JS代码可以判断浏览器是否支持 required 属性- <script>
- /* Original code from www.51-n.com */
- var requiredSupported='required' in document.createElement('input')&&!/Version\/[\d\.]+\s*Safari/i.test(navigator.userAgent);
- alert(requiredSupported);
- </script>
复制代码 从以上代码中不难看出,有一个特例。
对于 Safari 浏览器来说, 虽然 Safari 不支持 required 属性,
但是检测 DOM 元素是否有 required 这个成员属性的时候它会传回 true ,
所以必须使用浏览器特征用户代理来检测浏览器是否是 Safari 浏览器。
我们可以根据以上检测结果,为不兼容 required 属性的浏览器写Javascript代码兼容 required 属性。 |
|