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

Как проверить, имеет ли браузер встроенную функцию проверки формы HTML5? Поступая таким образом, нам не нужно применять функции проверки формы jQuery в браузерах, которые могут самостоятельно проверять форму.

[Решено] Основываясь на ответе ThinkingStiff, вот способ:

if (typeof document.createElement("input").checkValidity == "function") { alert("Your browser has built-in form validation!"); } 

Просто проверьте, существует ли 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а. Комбинацию этих тестов можно использовать для проверки того, где браузер не поддерживает проверку, и сообщать, где браузер не сообщает.

  • Что означает == $ 0 (double equals dollar zero) в инструментах разработчика Chrome?
  • Проверка группы переключателей с использованием плагина проверки jQuery
  • MVC DateTime validation - UK Формат даты
  • Концепция концепции проверки Struts 2
  • Убедитесь, что вход в UITextField только числовой
  • Разрешить пользователю вводить HTML в ASP.NET MVC - ValidateInput или AllowHtml
  • Принудительное JSF обрабатывать, проверять и обновлять компоненты для чтения / отключения ввода в любом случае
  • Как использовать Twitter Bootstrap popovers для уведомлений о проверке jQuery?
  • Проверка asp.net, чтобы убедиться, что текстовое поле имеет целочисленные значения
  • MVC Возвращает частичный вид как JSON
  • ASP.NET MVC - Пользовательское сообщение проверки для типов значений
  • Давайте будем гением компьютера.