--- title: Form Validation localeTitle: Проверка формы --- ## Проверка формы Проверка правильности, обычно используемая на сервере, после того, как клиент ввел все необходимые данные, а затем нажал кнопку «Отправить». Если данные введенный клиентом, был неправильным или просто отсутствовал, сервер должен был отправить все данные обратно клиенту и запросить, чтобы форма была повторно отправлен с правильной информацией. Это был действительно длительный процесс, который ставил большую нагрузку на сервер. JavaScript предоставляет способ проверки данных формы на компьютере клиента перед отправкой на веб-сервер. Проверка формы обычно выполняет два функции: ### Базовая проверка Прежде всего, форма должна быть проверена, чтобы убедиться, что все обязательные поля заполнены. Для этого требуется всего лишь цикл через каждое поле в форме и проверьте данные. ### Проверка формата данных Во-вторых, введенные данные должны быть проверены на правильную форму и значение. Ваш код должен содержать соответствующую логику для проверки правильности данных. #### Пример: ```html Form Validation
Name
EMail
Zip Code
Country
``` #### Вывод Смотри [здесь](https://liveweave.com/LP9eOP) ### Базовая проверка формы Сначала давайте посмотрим, как выполнить базовую проверку формы. В приведенной выше форме мы вызываем validate () для проверки данных при возникновении события onsubmit. следующий код показывает реализацию этой функции `validate()` . ```html ``` #### Вывод Смотри [здесь](https://liveweave.com/pCPTnP) ### Проверка формата данных Теперь мы увидим, как мы можем проверить наши введенные данные формы перед отправкой на веб-сервер. В следующем примере показано, как проверить введенный адрес электронной почты. Адрес электронной почты должен содержать хотя бы знак «@» и точку (.). Кроме того, '@' должен не должен быть первым символом адреса электронной почты, а последняя точка должна быть по крайней мере одним символом после знака «@». #### Пример: ```html ``` #### Вывод Смотри [здесь](https://liveweave.com/nznVs6) ### Ограничения формы HTML5 Некоторые из обычно используемых ограничений HTML5 для `` - это атрибут `type` (например, `type="password"` ), `maxlength` , `required` и `disabled` . Меньше обычно используемым ограничением является `pattern` attrinute, который принимает регулярное выражение JavaScript. ### Библиотеки проверки Примеры библиотек проверки включают: * [Validate.js](http://rickharrison.github.com/validate.js/) * [Проверка](http://bassistance.de/jquery-plugins/jquery-plugin-validation/) * [Valid8](http://unwrongest.com/projects/valid8/) ### Больше информации * [Проверка данных формы | MDN](https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Form_validation) * [Проверка ограничений | MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation) * [Tutorialspoint](https://www.tutorialspoint.com/javascript/javascript_form_validations.htm)