Что такое form в HTML5?
HTML тег
<form>
является невероятно полезным тегом, использование которого позволяет создавать различные формы на сайте. Сам по себе тег не создает форму с полями или же чекбоксами. Все что он делает, это объединяет различные поля (input) вместе и при помощи клиентских скриптов или же серверных вы можете получить информацию из каждого поля по отдельности и работать с ней на ваше усмотрение: добавить в базу данных, записать в файл на сервере и так далее. Требует закрывающий тег </form>
.Стоит знать: На сайтах зачастую присутствует не одна форма, а сразу несколько. Вы можете поставить любое количество таких форм на сайте, но передавать одновременно на сервер возможно лишь одну из них.
Еще одним дополнительным плюсом является использование клавиши
Enter
. Чтобы отправить форму вы можете нажать на соответствующую кнопку в ней или же просто на кнопку Enter
, что конечно гораздо проще.При передаче данных на сервер всю информацию вы можете получить двумя методами: GET или же POST. Более подробно обо всем этом вы узнаете когда приступите к изучению серверного языка программирования, например PHP.
Атрибуты:
name
- имя для формы. Позже по этому имени вы сможете обращаться к элементам в форме и брать их значения;method
- метод отправки данных на сервер. Возможно GET или же POST;target
- какой-либо объект или же область на странице сайта, куда в результате выполнения формы будут отправляться результаты её выполнения;enctype
- этот атрибут позволяет указать способ кодирования информации в форме;novalidate
- возможность отметить проверку на валидность (правильность) формы по умолчанию;autocomplete
- в форме есть возможность автозаполнения некоторых полей. При помощи этого атрибута такое автозаполнение будет отключено;accept-charset
- можно установить необходимую кодировку. К примеру, accept-charset="utf-8" означает что данные на сервере будут приниматься и обрабатываться в этой кодировке;action
- здесь указывается страница сайта, на которой будет происходить обработка формы после нажатия на кнопку "Отправить". Также этот атрибут может иметь пустое значение. В таком случае обработка формы будет происходить на этой же странице.
Пример:
<h2>Форма отправки при помощи тега Form</h2>
<form method="get" action="" name="mailForm">
<label for="name">Ваше имя</label>
<input type="text" id="name" name="name" placeholder="Введите имя"><br>
<label for="email">Email</label>
<input type="email" id="email" name="email" placeholder="Введите email"><br><br>
<label for="mess">Сообщение</label><br>
<textarea id="mess" name="mess" placeholder="Введите имя"></textarea><br>
<input type="submit" value="Отправить">
</form>
Результат:
Форма отправки при помощи тега Form
Комментарии