Проверьте, имеет ли браузер встроенную проверку HTML5?

Просто проверьте, существует ли checkValidity() :

Демо: http://jsfiddle.net/ThinkingStiff/cmSJw/

 function hasFormValidation() { return (typeof document.createElement( 'input' ).checkValidity == 'function'); }; 

Назовите это так:

 if( hasFormValidation() ) { //HTML5 Form Validation supported }; 

Вы можете сделать это, используя javascript Modernizr http://www.modernizr.com/ . Вы можете воспользоваться этой службой html5 для проверки подлинности safari . Вы также можете воспользоваться современной загрузкой

Основной синтаксис для Modernizr.load () – передать ему объект со следующими свойствами:

• test: свойство Modernizr, которое вы хотите обнаружить.
• yep: расположение скрипта, который вы хотите загрузить, если тест будет успешным. Используйте массив для нескольких сценариев.
• nope: расположение сценария, который вы хотите загрузить, если тест завершился неудачно. Используйте массив для нескольких сценариев.
• complete: функция, которая будет запущена сразу после загрузки внешнего скрипта (необязательно).

И yep и nope являются необязательными, если вы поставляете один из них.

Чтобы загрузить и выполнить скрипт в файле check_required.js, добавьте следующий блок после того, как к странице был прикреплен файл modernizr.adc.js (код находится в required_load.html):

Источник: http://www.adobe.com/devnet/dreamweaver/articles/using-moderniz.html

Как насчет

 function hasFormValidation() { return 'noValidate' in document.createElement('form'); } 

Источник: http://diveintohtml5.info/everything.html#novalidate

Существует проблема с навигаторами, такими как Android one (версии до 4.4), которые реализуют checkValidity (и эта функция фактически проверяет входы), но браузер не предоставляет никакой информации пользователю (и отправляет форму), если какой-либо ввод инвалид.

Тем не менее, вы можете проверить, есть ли какие-либо проблемы с помощью validationMessage . Это свойство покажет вам сообщение об ошибке, которое браузер покажет пользователю. Если checkValidity() является ложным, но не существует validationMessage браузер не имеет полной поддержки проверки формы html5.

Я сделал эту функцию. Он требует в качестве аргумента всех полей в форме:

 canValidateFields() { var result = typeof document.createElement( 'input' ).checkValidity == 'function'; if (result) { for (var i = 0; i < arguments.length; i++) { var element = document.getElementById(arguments[i]); if (!element.checkValidity() && (!element.validationMessage || element.validationMessage === null || element.validationMessage === '')) { return false; } } } return result; } 

Образец: http://jsfiddle.net/pmnanez/ERf9t/2/

Следующие тесты не работали для Safari:

'noValidate' in document.createElement('form')

а также

typeof document.createElement( 'input' ).checkValidity == 'function'

Они сообщают об true когда ожидалось false , поскольку Safari не сообщает недопустимые поля.

Однако этот тест работает:

'reportValidity' in document.createElement('form')

(не тестировался в IE или Android)

EDIT: Safari проверяет, но не сообщает, что объясняет ответы на эти тесты. Недействительные поля могут быть обнаружены с помощью CSS :invalid псевдо classа. Комбинацию этих тестов можно использовать для проверки того, где браузер не поддерживает проверку, и сообщать, где браузер не сообщает.