EducationBot: Новая страница: «{{Русская Википедия/Панель перехода}} {{HTML}} '''Форма''' ({{lang-en|form}}) в HTML — раздел документа, позволяющий пользователю вводить информацию для последующей обработки системой. Синтаксически форма в HTML задаётся с помощью элемента
и в допол...»

2023-09-24T13:08:20Z

Новая страница: «{{Русская Википедия/Панель перехода}} {{HTML}} '''Форма''' ({{lang-en|form}}) в HTML — раздел документа, позволяющий пользователю вводить информацию для последующей обработки системой. Синтаксически форма в HTML задаётся с помощью элемента <code><nowiki><form></nowiki></code> и в допол...»

Новая страница

{{Русская Википедия/Панель перехода}}
{{HTML}}
'''Форма''' ({{lang-en|form}}) в HTML — раздел документа, позволяющий пользователю вводить информацию для последующей обработки системой. Синтаксически форма в HTML задаётся с помощью элемента <code><nowiki><form></nowiki></code> и в дополнение к разметке обычных элементов содержит разметку для '''[[элемент интерфейса|элементов управления]]''' ({{lang-en|controls}}), надписей ({{lang-en|label}}) и других<ref name="Спецификация языка HTML">[http://www.intuit.ru/department/internet/html/17/ Спецификация языка HTML] {{Wayback|url=http://www.intuit.ru/department/internet/html/17/ |date=20121204083028 }}, переводчик: А. Пирамидин, intuit.ru, ISBN 978-5-94774-648-8, 17. Лекция: Формы.</ref><ref name="W3C HTML4 Specification">[http://www.w3.org/TR/html4/interact/forms.html Forms in HTML documents] {{Wayback|url=http://www.w3.org/TR/html4/interact/forms.html |date=20210422071447 }}{{ref-en}} Спецификация W3C для HTML4</ref>.

== Пример ==
Простая форма для ввода данных о новом пользователе<ref name="Спецификация языка HTML" />:
<source lang="html5">
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>
Регистрация
</title>
</head>
<body>
<form action="http://example.com/app/profile.php" method="post">
<p>
<label for="username">
Имя:
</label>
<input type="text" name="username" />
<br />
<label for="nick">
Ник:
</label>
<input type="text" name="nick" />
<br />
<label for="email">
Адрес эл. почты:
</label>
<input type="text" name="email" />
<br />
<label for="sex">
Пол:
</label>
<input type="radio" name="sex" value="male" />
мужской
<br />
<input type="radio" name="sex" value="female" />
женский
<br />
<input type="radio" name="sex" value="secret" />
не хочу отвечать
<input type="submit" value="Отправить">
<input type="reset" value="Очистить">
</p>
</form>
</body>
</html>
</source>


В этом примере форма содержит три текстовых поля для ввода текстовой строки, [[радиокнопка|радиокнопки]] для выбора пола, кнопки для отправки ({{lang-en|submit}}) и очистки ({{lang-en|reset}}) формы.

== Элементы управления ==
Элементы управления служат для взаимодействия пользователя с формой. Атрибут <code>name</code> определяет имя элемента управления с [[область видимости|областью видимости]] внутри данной формы.

С каждым элементом формы связано ''начальное'' и ''текущее'' значение. За некоторыми исключениями (<code><textarea></code>, <code><object></code>), начальное значение может быть задано атрибутом <code>value</code>. Значения, соответствующие элементам, могут изменяться при взаимодействии пользователя или [[скрипт]]ов (например, на [[Javascript]]) с формой. При очистке ({{lang-en|reset}}) формы элементы приобретают начальные значения. Данные всех ''действующих'' ({{lang-en|successful}}) элементов формы отправляются ({{lang-en|submit}}) на обработку в виде пар имя-значения<ref name="Спецификация языка HTML" /><ref name="W3C HTML4 Specification" />.

=== Типы ===
В HTML определены следующие элементы управления:
* кнопка: элемент <code><nowiki><input></nowiki></code> типов <code>submit</code> (отправка формы), <code>image</code> (картинка-кнопка), <code>reset</code> (очистка формы, приведение формы в начальное состояние), <code>button</code> (кнопка), а также элемент <code><button></code> (отправка формы);
* [[чекбокс]] (флажок): тип <code>checkbox</code>;
* [[радиокнопка]]: тип <code>radio</code>;
* меню: элемент <code><nowiki><select></nowiki></code> с элементами <code><nowiki><optgroup></nowiki></code> и <code><nowiki><option></nowiki></code> внутри;
* строка текста: тип <code>text</code>, а также элемент <code><nowiki><textarea></nowiki></code> (многострочное текстовое поле);
* пароль: тип <code>password</code>;
* скрытое поле: тип <code>hidden</code>;
* файл: тип <code>file</code>.

[[HTML5]] определяет дополнительные элементы ([[кросс-браузерность]] пока отсутствует)<ref>{{Cite web |url=http://www.w3schools.com/html/html5_form_elements.asp |title=HTML5 Form Elements, w3schools |accessdate=2012-12-02 |archiveurl=https://web.archive.org/web/20130513144520/http://www.w3schools.com/html/html5_form_elements.asp |archivedate=2013-05-13 |deadlink=yes }}</ref>:
* элемент <code><datalist></code> с вариантами автозаполнения строки текста;
* элемент <code><output></code> для результата вычисления на основе других полей;
* элемент <code><keygen></code> для генерации пары ключей для использования в механизме [[аутентификация|аутентификации]].

== Элемент <nowiki><form></nowiki> ==
Форма задаётся с помощью элемента <code><form></code>, внутри которого и располагаются элементы управления. Кроме общих для HTML атрибутов, в <code><form></code> могут присутствовать следующие<ref name="Спецификация языка HTML" /><ref name="W3C HTML4 Specification" />:
* <code>action</code> (действие) — обязательный атрибут (в HTML5 — нет), содержащий [[URI]] обработчика формы;
* <code>method</code> (метод отправки формы) — атрибут, принимающий значения GET (по умолчанию) или POST;
* <code>enctype</code> (тип кодирования для содержимого) — по умолчанию <code>application/x-www-form-urlencoded</code> (всегда для метода GET), но обычно употребляется [[multipart/form-data]];
* <code>accept</code> — список [[MIME]]-типов для загрузки файлов;
* <code>name</code> — имя формы;
* <code>onsubmit</code> — обработчик события «форма отправлена» (для скриптов);
* <code>onreset</code> — обработчик события: «форма очищена» (тоже для скриптов);
* <code>accept-charset</code> список поддерживаемых наборов символов.

== Отправка формы ==
Для отправки формы имеются два метода: GET и POST. Метод GET рекомендуется использовать в случаях, когда при обработке формы на стороне сервера не происходит побочных действий, например, поиск. В противном случае, когда на стороне сервера подразумевается модификация в базах данных и т. п., требуется использовать метод POST<ref name="Спецификация языка HTML" />.

== См. также ==
* [[Пароль]]
* [[XForms]]

== Примечания ==
{{примечания}}

{{rq|sources|img}}

[[Категория:Гипертекст]]
[[Категория:HTML]]
{{Навигационная таблица/Портал/Русская Википедия}}
[[Категория:Русская Википедия]]
[[Категория:Википедия]]
[[Категория:Статья из Википедии]]
[[Категория:Статья из Русской Википедии]]

Русская Википедия:Форма (HTML) - История изменений