path: root/files/ru/web/html/element/form/index.html

---
title: <form>
slug: Web/HTML/Element/form
translation_of: Web/HTML/Element/form
---
<h2 id="Summary" name="Summary">Резюме</h2>

<p><em>Элемент HTML form</em> (<code>&lt;form&gt;</code>) представляет (собой) раздел документа, содержащий интерактивные элементы управления, которые позволяют пользователю отправлять информацию на веб-сервер.</p>

<p>Можно использовать <code><a href="/en-US/docs/CSS/%3Avalid" rel="custom">:valid</a></code> и <code><a href="/en-US/docs/CSS/%3Ainvalid" rel="custom">:invalid</a></code> CSS псевдоклассы для стилизации <code>&lt;form&gt;</code> элемента, в зависимости от того, валиден или нет конкретный элемент {{domxref("HTMLFormElement.elements", "elements")}} внутри формы.</p>

<h2 id="Usage_Context" name="Usage_Context">Контекст Использования</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <td>Категория содержимого</td>
   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a></td>
  </tr>
  <tr>
   <td>Разрешённое содержимое</td>
   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, но не содержащий <code>&lt;form&gt;</code> элементов</td>
  </tr>
  <tr>
   <td>Пропуск тега</td>
   <td>Нет. И открывающий и закрывающий тег должны быть.</td>
  </tr>
  <tr>
   <td>Нормативный документ</td>
   <td><a href="http://www.w3.org/TR/html5/forms.html#the-form-element">HTML5, section 4.10.3</a> (<a href="http://www.w3.org/TR/1999/REC-html401-19991224/interact/forms.html#h-17.3">HTML4.01, section 17.3</a>)</td>
  </tr>
 </tbody>
</table>

<h2 id="Attributes" name="Attributes">Атрибуты</h2>

<p>Как и все HTML-элементы, этот элемент поддерживает <a href="/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">глобальные атрибуты</a>.</p>

<dl>
 <dt>{{htmlattrdef("accept")}} {{HTMLVersionInline(4)}} {{obsolete_inline}}</dt>
 <dd>Список типов содержимого, разделённых запятой, которые принимает сервер.
 <div class="note"><strong>Примечание об использовании:</strong> Этот атрибут был удалён в HTML5 и его не следует больше использовать. Взамен, используйте <span class="st">{{htmlattrxref("accept", "input")}}</span> атрибут заданного {{HTMLElement("input")}} элемента.</div>
 </dd>
 <dt>{{htmlattrdef("accept-charset")}}</dt>
 <dd>Разделённые пробелами <a href="/en-US/docs/Web/Guide/Localizations_and_character_encodings">символьные кодировки</a>, которые принимает сервер. Браузер использует их в том порядке, в котором они перечислены. Значение по умолчанию означает <a href="/en-US/docs/Web/HTTP/Headers/Content-Encoding">ту же кодировку что и у страницы</a>.<br>
 (В предыдущей версии HTML, различные кодировки могли быть разделены запятыми.)</dd>
 <dt>{{htmlattrdef("action")}}</dt>
 <dd>URI-адрес программы, которая обрабатывает информацию переданную через форму. Это значение может быть переписано с помощью атрибута {{htmlattrxref("formaction", "button")}} на {{HTMLElement("button")}} или {{HTMLElement("input")}} элементе.</dd>
 <dt>{{htmlattrdef("autocomplete")}} {{HTMLVersionInline(5)}}</dt>
 <dd>Указывает, могут ли элементы управления автоматически быть дописаны в форме браузером. Эта настройка может быть переписана с помощью атрибута <code>autocomplete</code> на элементе формы. Возможные значения:
 <ul>
  <li><code>off</code>: Пользователь должен явно ввести значение в каждое поле или документ предоставит свой собственный метод автодополнения; браузер автоматически не дополняет записи.</li>
  <li><code>on</code>: Браузер может автоматически дополнить значения, основанные на значениях, которые пользователь уже вводил, в течение предыдущего использования формы.</li>
 </ul>

 <div class="note">
 <p><strong>Примечание: </strong>Если вы установили значение <code>off</code> <code>для</code> <code>autocomplete</code> атрибута ​​​​​формы, из-за того, что документ предоставляет своё собственное автодополнение, то вам следует также установить значение <code>off</code> для <code>autocomplete</code> каждого {{HTMLElement("input")}} элемента формы, которые документ может автоматически дополнить. Подробнее, смотрите {{anch("Google Chrome notes")}}.</p>
 </div>
 </dd>
 <dt>{{htmlattrdef("enctype")}}</dt>
 <dd>Когда значение атрибута method равно <code>post</code>, атрибут - <a href="http://en.wikipedia.org/wiki/Mime_type">MIME тип</a> содержимого, которое используется, чтобы передать форму на сервер. Возможные значения:
 <ul>
  <li><code>application/x-www-form-urlencoded</code>: Значение по умолчанию, если атрибут не задан.</li>
  <li><code>multipart/form-data</code>: Используйте это значение, если пользуетесь элементом {{HTMLElement("input")}} атрибутом <code>type</code> установленным в "file".</li>
  <li><code>text/plain (HTML5)</code></li>
 </ul>

 <p>Это значение может быть переписано атрибутом {{htmlattrxref("formenctype", "button")}} на элементе {{HTMLElement("button")}} или {{HTMLElement("input")}}.</p>
 </dd>
 <dt>{{htmlattrdef("method")}}</dt>
 <dd><a href="/en-US/docs/HTTP" title="http://www.w3.org/Protocols/rfc2616/rfc2616.html">HTTP</a> метод, который браузер использует, для отправки формы. Возможные значения:
 <ul>
  <li><code>post</code>: Соответствует HTTP <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.5">POST методу</a> ; данные из формы включаются в тело формы и посылаются на сервер.</li>
  <li><code>get</code>: Соответствует <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.3">GET методу</a>; данные из формы добавляются к URI атрибута <code>action</code>, их разделяет '?', и полученный URI посылается на сервер. Используйте этот метод, когда форма содержит только ASCII символы и не имеет побочного эффекта.</li>
 </ul>

 <p>Это значение может быть переписано атрибутом {{htmlattrxref("formmethod", "button")}} на {{HTMLElement("button")}} или {{HTMLElement("input")}} элементе.</p>
 </dd>
 <dt>{{htmlattrdef("name")}}</dt>
 <dd>Имя формы. В HTML 4 его использование запрещено (<code>id</code> следует использовать взамен). Оно должно быть уникальным и не пустым среди всех форм в документе в HTML 5.</dd>
 <dt>{{htmlattrdef("novalidate")}} {{HTMLVersionInline(5)}}</dt>
 <dd>Это Boolean атрибут показывает, что форма не проверяется на валидность, когда отправляется серверу. Если атрибут пропущен (и поэтому форма проверяется), эта настройка по умолчанию, может быть переписана атрибутом {{htmlattrxref("formnovalidate", "button")}} на {{HTMLElement("button")}} или {{HTMLElement("input")}} элементе, принадлежащем форме.</dd>
 <dt>{{htmlattrdef("target")}}</dt>
 <dd>Имя или ключевое слово, показывающее где отображать ответ, который будет получен, после отправки формы. В HTML 4, это имя или ключевое слово для фрейма. В HTML5, это имя или ключевое слово, <em>контекста</em> <em>просмотра </em>(например, вкладка, окно, или линейный фрейм). Следующие ключевые слова имеют специальное значение:
 <ul>
  <li><code>_self</code>: Загружает ответ в том же самом фрейме HTML 4 (или HTML5 контексте просмотра) как текущий. Это значение по умолчанию, если атрибут не указан.</li>
  <li><code>_blank</code>: Загружает ответ в новом безымянном окне HTML 4 или HTML5 контексте просмотра.</li>
  <li><code>_parent</code>: Загружает ответ HTML 4 в родительском наборе фрейма для текущего фрейма или HTML5 родительский контекст просмотра для текущего просмотра. Если нет предка, эта опция действует точно так же как as <code>_self</code>.</li>
  <li><code>_top</code>: HTML 4: Загружает ответ в полное, оригинальное окно, закрывая все другие фреймы. HTML5: Загружает ответ в верхний уровень контекста просмотра (т.е., контекст просмотра это предок текущего и не имеет других предков). Если нет предка, эта опция действует точно так же как as <code>_self</code>.</li>
 </ul>

 <p>HTML5: Это значение может быть перезаписано {{htmlattrxref("formtarget", "button")}} атрибутом на {{HTMLElement("button")}} или {{HTMLElement("input")}} элементе.</p>
 </dd>
</dl>

<h2 id="DOM_interface" name="DOM_interface">DOM_interface</h2>

<p>Этот элемент реализует {{domxref("HTMLFormElement")}} интерфейс.</p>

<h2 id="Examples" name="Examples">Примеры</h2>

<pre class="brush: html">&lt;!-- Простая форма, которая пошлёт GET запрос --&gt;
&lt;form action=""&gt;
  &lt;label for="GET-name"&gt;Name:&lt;/label&gt;
  &lt;input id="GET-name" type="text" name="name"&gt;
  &lt;input type="submit" value="Save"&gt;
&lt;/form&gt;

&lt;!-- Простая форма, которая пошлёт POST запрос --&gt;
&lt;form action="" method="post"&gt;
  &lt;label for="POST-name"&gt;Name:&lt;/label&gt;
  &lt;input id="POST-name" type="text" name="name"&gt;
  &lt;input type="submit" value="Save"&gt;
&lt;/form&gt;

&lt;!-- Форма с fieldset, legend, и label --&gt;
&lt;form action="" method="post"&gt;
  &lt;fieldset&gt;
    &lt;legend&gt;Title&lt;/legend&gt;
    &lt;input type="radio" name="radio" id="radio"&gt; &lt;label for="radio"&gt;Click me&lt;/label&gt;
  &lt;/fieldset&gt;
&lt;/form&gt;
</pre>

<h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость браузера</h2>

<p>{{Compat("html.elements.form")}}</p>

<h2 id="See_also" name="See_also">Смотрите также</h2>

<ul>
 <li>Другие элементы, которые используются для создания форм: {{HTMLElement("button")}}, {{HTMLElement("datalist")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("input")}},{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("legend")}}, {{HTMLElement("meter")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("option")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, {{HTMLElement("select")}}, {{HTMLElement("textarea")}}.</li>
</ul>

<p><label>{{HTMLRef}}</label></p>