Формы в HTML

62 просмотров Время на прочтение: 3 минут(ы)

Форма – это объект, который объединяет элементы ввода данных (текстовые поля, списки, флажки и другие) в веб-браузере для передачи серверу на обработку скриптами, например, написанными на языке программирования PHP.

Пример 1

Форму создаёт HTML элемент “form”. Атрибут “action” задаёт адрес скрипта, обрабатывающего данные формы. Атрибут “method” указывает способ передачи данных скрипту. Если значение этого атрибута – “get”, то передаваемые данные записываются в адресе веб-страницы в формате:

index.php?name1=value1&name2=value2&name3=value3…

где “index.php” – скрипт, получающий данные и генерирующий веб-страницу; “name…” – названия элементов данных; “value…” – значения элементов данных; “?” – знак перед данными; “&” – знак, соединяющий два элемента данных. Если значение атрибута “method” равно “post”, то передаваемые данные не записываются в адресе веб-страницы.

HTML элемент “input” создаёт при значении “text” атрибута “type” – текстовое поле, а при значении “submit” этого атрибута – кнопку отправки данных формы на сервер. Атрибут “name” задаёт название текстового поля. Он может быть и у кнопки, чтобы задать название кнопки. Атрибут “value” указывает надпись на кнопке. Он может быть и у текстового поля, чтобы указать текст в текстовом поле.

Пример 2

HTML элемент “input” создаёт следующие объекты при значениях атрибута “type”:

typeОбъект
emailПоле для адреса электронной почты
passwordПоле для пароля
dateПоле для даты. При нажатии кнопки справа от даты открывается календарь для выбора даты.
resetКнопка для очищения полей формы

Пример 3

HTML элемент “input” создаёт следующие объекты при значениях атрибута “type”:

typeОбъект
hiddenНевидимое поле. Его название и значение передаётся скрипту на сервере для обработки.
numberПоле для числа
checkboxФлажок. Используется для выбора или не выбора какого-либо варианта.
radioПереключатель. Используется для выбора одного варианта из нескольких.

Атрибут “checked” указывает, что флажок или переключатель отмечен. Переключатели передадут скрипту на сервер значение атрибута “value” отмеченного переключателя с именем заданным в атрибуте “name”.

HTML элемент “label” содержит текст и элемент “input”. При нажатии на этот текст фокус передаётся элементу “input”.

Пример 4

Если атрибут “type” HTML элемента “input” имеет значение “file”, то элемент “input” создаёт поле для загрузки файла на сервер. Атрибут “multiple” означает, что можно выбрать для загрузки более одного файла. Атрибут “accept” указывает форматы файлов, которые можно выбрать. Форматы указываются через запятую. Можно указать расширения допустимых файлов с точками перед расширениями. Некоторые форматы:

ФорматЗначение
image/pngИзображение PNG
image/jpegИзображение JPEG. Файлы с расширениями “.jpg” и “.jpeg”.
image/*Любое изображение
audio/*Любое аудио
video/*Любое видео

Чтобы загрузить файл на сервер, обязательно нужно указать в атрибуте “enctype” HTML элемента “form” значение “multipart/form-data”.

Пример 5

HTML элемент “fieldset” создаёт рамку вокруг элементов ввода. Название рамки находится в элементе “legend” .

HTML элемент “select” создаёт список, пункты которого находятся в элементах “option”. Если есть атрибут “multiple”, то количество видимых пунктов указывается в атрибуте “size” и значение атрибута “name” содержит квадратные скобки в конце, иначе список является раскрывающимся.

HTML элемент “textarea” создаёт многострочное текстовое поле. Атрибут “cols” задаёт количество столбцов, а атрибут “rows” – количество строк.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

©2024 Шигорин Сергей Владимирович
Мы используем cookie-файлы для наилучшего представления нашего сайта. Продолжая использовать этот сайт, вы соглашаетесь с использованием cookie-файлов.
Принять
Top.Mail.Ru
Каталог сайтов Всего.ру
Белый каталог сайтов PopCat.ru