HTML Атрибуты формы
В этом разделе описываются различные атрибуты HTML элемента <form>.
Атрибут Action
Атрибут action определяет действие, которое должно быть выполнено при отправке формы.
Обычно данные формы отправляются в файл на сервере, когда пользователь нажимает кнопку отправки.
В приведенном ниже примере данные формы отправляются в файл с именем "action_page.html". Этот файл содержит серверный скрипт (обычно на языке PHP), который обрабатывает данные формы:
Пример
При отправке отправьте данные формы по адресу "action_page.html":
<form action='/action_page.html'>
<label for="fname">First
name:</label><br>
<input type="text" id="fname" name="fname"
value="John"><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname" value="Doe"><br><br>
<input type="submit" value="Submit">
</form>
Попробуйте сами »
Примечание: Если атрибут action опущен, action устанавливается на текущую страницу.
Атрибут Target
Атрибут target указывает, где отображать ответ, полученный после отправки формы.
Атрибут target может иметь одно из следующих значений:
| Значение | Описание |
|---|---|
| _blank | Ответ отображается в новом окне или вкладке |
| _self | Ответ отображается в текущем окне |
| _parent | Ответ отображается в родительском фрейме |
| _top | Ответ отображается во всем окне |
| framename | Ответ отображается в указанном iframe |
Значение по умолчанию _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 указывает, должна ли форма иметь автозаполнение или off (отключено).
Когда автозаполнение включено, браузер автоматически заполняет значения на основе значений, которые пользователь ввел ранее.
Пример
Форма с автозаполнением на:
<form action="/action_page.html" autocomplete="on">
Попробуйте сами »
Атрибут Novalidate
Атрибут novalidate - это логический атрибут.
Когда присутствует, он указывает, что данные формы (ввод) не должны проверяться при отправке.
HTML Упражнения
Список всех атрибутов <form>
| Атрибут | Описание |
|---|---|
| accept-charset | Определяет кодировки символов, используемые для отправки формы |
| action | Определяет, куда отправлять данные формы при отправке формы |
| autocomplete | Определяет, должно ли автозаполнение формы включаться или выключаться |
| enctype | Определяет, как должны быть закодированы данные формы при их отправке на сервер (только для method="post") |
| method | Определяет метод HTTP для использования при отправке данных формы |
| name | Задает имя формы |
| novalidate | Указывает, что форма не должна проверяться при отправке |
| rel | Определяет связь между связанным ресурсом и текущим документом |
| target | Указывает, где отображать ответ, полученный после отправки формы |
