Способ проверить правильность форм HTML5?

Можно ли проверить, является ли элемент ввода формы html5 действительным на основе шаблона, который я установил для него? Я знаю материал класса psuedo.. но я надеюсь что-то вроде: document.getElementById('petitionName').valid может возвращать true или false..

Я действительно надеюсь, что мне не нужно создавать javascript для повторной проверки этого материала.

Ответы

Ответ 1

существует два способа проверить достоверность.

  • inputElement.checkValidity() возвращает true или false
  • inputElement.validity возвращает объект состояния действительности. inputElement.validity.valid возвращает true/false

Вместо использования keyup вы также можете использовать событие "input". Все браузеры, которые реализовали API проверки ограничений, также внедрили входное событие.

Если вы используете 1. Opera имеет ошибку здесь и покажет подсказку подтверждения. Поэтому вы должны использовать 2.

Я создал библиотеку html5 forms libary, которая реализует все неизвестные функции для неспособных браузеров + исправляет проблемы в браузерах HTML5. Итак, все работает так, как определено в спецификации, но построено поверх jquery.... (http://afarkas.github.com/webshim/demos/index.html)

Ответ 2

Вы можете использовать атрибут pattern.

Он будет проверять его на стороне клиента, поэтому нет необходимости проверять его снова на стороне клиента.

Example

jsFiddle.

Но, убедитесь, что вы делаете это снова на стороне сервера.

Также обратите внимание на то, что сейчас совместимость браузеров довольно плохая, JavaScript является нормой для проверки клиентской стороны.