HTML Атрибуты формы
В этом разделе описываются разные атрибуты HTML элемента <form>.
Атрибут Action
Атрибут action определяет действие, которое должно быть выполнено при отправке формы.
Обычно данные формы отправляются в файл на сервере, когда пользователь нажимает кнопку отправки.
В приведённом ниже примере данные формы отправляются в файл с именем «action_page.html». Этот файл содержит серверный скрипт (обычно на языке PHP), который обрабатывает данные формы:
Пример
При отправке отправьте данные формы по адресу "action_page.html":
<form action='/action_page.html'>
<label for="fname">Ім’я:</label><br>
<input type="text" id="fname" name="fname" value="John"><br>
<label for="lname">Прізвище:</label><br>
<input type="text" id="lname" name="lname" value="Doe"><br><br>
<input type="submit" value="Відправити">
</form>
Попробуйте сами »
Примечание: Если атрибут action опущен, action устанавливается на текущую страницу.
Атрибут Target
Атрибут target указывает, где отображается ответ, полученный после отправки формы.
Атрибут target может иметь одно из следующих значений:
| Значение | Описание |
|---|---|
| _blank | Ответ отображается в новом окне или вкладке |
| _self | Ответ отображается в текущем окне |
| _parent | Ответ отображается в родительском фрейме |
| _top | Ответ отображается во всём окне |
| framename | Ответ отображается в указанном фрейме |
Значение по умолчанию _self означает, что ответ откроется в текущем окне.
Пример
Отправленный результат откроется в новой вкладке браузера:
<form action='/action_page.html' target='_blank'>
Попробуйте сами »
Атрибут Method
Атрибут method определяет HTTP‑метод, который будет использоваться при отправке данных формы.
Данные формы могут быть отправлены как переменные URL (с method="get") или как HTTP‑POST транзакция (с method="post").
Метод HTTP по умолчанию при отправке данных формы — GET.
Пример
В этом примере используется метод GET при отправке данных формы:
<form action='/action_page.html' method='get'>
Попробуйте сами »
Пример
В этом примере используется метод POST при отправке данных формы:
<form action='/action_page.html' method='post'>
Попробуйте сами »
Примечание к GET:
- Добавляет данные формы к URL‑адресу в виде пар «имя/значение»
- НИКОГДА не используйте GET для отправки конфиденциальных данных! (отправленные данные формы видны в URL!)
- Длина URL ограничена (2048 символов)
- Полезен для отправки форм, когда пользователь хочет добавить результат в закладки
- GET подходит для незащищённых данных, таких как строки запроса в поиске Google
Примечание к POST:
- Добавляет данные формы в тело HTTP‑запроса (отправленные данные формы не отображаются в URL‑адресе)
- POST не имеет ограничений по размеру и может использоваться для отправки больших объёмов данных
- Отправленные формы с помощью POST невозможно добавить в закладки
Совет: Всегда используйте POST, если данные формы содержат конфиденциальную или личную информацию!
Атрибут Autocomplete
Атрибут autocomplete указывает, должно ли автозаполнение формы быть включено или отключено.
Когда автозаполнение включено, браузер автоматически подставляет значения на основе данных, которые пользователь вводил ранее.
Пример
Форма с автозаполнением на:
<form action="/action_page.html" autocomplete="on">
Попробуйте сами »
Атрибут Novalidate
Атрибут novalidate — это логический атрибут.
Когда он присутствует, он указывает, что данные формы (ввод пользователя) не должны проходить проверку при отправке.
HTML Упражнения
Список всех атрибутов <form>
| Атрибут | Описание |
|---|---|
| accept-charset | Определяет кодировку символов, используемую при отправке формы |
| action | Определяет, куда отправлять данные формы при её отправке |
| autocomplete | Определяет, должно ли автозаполнение формы быть включено или выключено |
| enctype | Определяет, как должны быть закодированы данные формы при отправке на сервер (только для method="post") |
| method | Определяет HTTP‑метод, используемый при отправке данных формы |
| name | Задаёт имя формы |
| novalidate | Указывает, что форма не должна проверяться при отправке |
| rel | Определяет связь между связанным ресурсом и текущим документом |
| target | Указывает, где отображать ответ, полученный после отправки формы |
