Главная/ Cправочник HTML, CSS, Javascript/ HTML справочник : HTML теги, HTML атрибуты, мета теги, спецсимволы/ Tags/ HTML тег form | назначение, синтаксис, атрибуты, примеры

Тег form

Последнее обновление: 23.01.2011

Тег <form> (с англ. форма) — тег-контейнер, создает форму на странице. Форма применяется для обмена данными между пользователями и сервером.
Блочный элемент.

HTML: 3.2 | 4 / XHTML: 1.0 | 1.1

Синтаксис


<form action="...">...</form>

Атрибуты



accept список типов содержимого, через запятую, которые сервер-обработчик формы будет корректно обрабатывать
accept-charset список кодировок для вводимых данных, принимаемых сервером, обрабатывающим данную форму
action URL обработчика данных на сервере. Обязательный параметр!
class определяет имя используемого класса
dir определяет направление символов:

  • ltr — слева направо
  • rtl — справа налево
enctype задает способ кодирования данных при отправке на сервер. Значение по умолчанию application/x-www-form-urlencoded
id уникальный идентификатор
lang определяет язык отображаемого документа
method задает метод отправки данных

  • GET — данные передаются в адресной строке в виде пар «имя=значение» (по умолчанию)
  • POST — посылает данные в запросе браузера. Применяется для отправки данных большого объема
name уникальное имя формы
onclick щелчок на элементе
ondblclick двойной щелчок на элементе
onkeydown нажатие клавиши, когда элемент имеет фокус
onkeypress нажатие и освобождении клавиши, когда элемент имеет фокус
onkeyup освобождение ранее нажатой клавиши, когда элемент имеет фокус
onmousedown нажатие кнопки мыши, когда элемент имеет фокус
onmousemove движение указателя мыши, когда элемент имеет фокус
onmouseout смещение указателя мыши с элемента
onmouseover помещение указателя мыши на элемент
onmouseup освобождение ранее нажатой кнопки мыши, когда элемент имеет фокус
onreset возникает при очистке формы
onsubmit возникает при отправке формы
runat runat=»server» показывает, что форма должна быть обработана на сервере.
Отсутствует в спецификации HTML 4.01!
target окно или фрейм, куда будет возвращаться результат запроса
Зарезервированные имена:

  • _blank — откроет документ в новом окне
  • _parent — откроет документ во фрейме-родителе. Если такого нет, откроет в текущем окне.
  • _top — отменяет все фреймы и загружает страницу в полном окне браузера, если фремов нет, откроет в текущем окне
  • _self — откроет в текущем окне (по умолчанию)
style задает встроенную таблицу стилей
title всплывающая подсказка

Пример


<form action="post">
<div>
<label for="inpSearch">Я ищу:</label>
<input name="inpSearch" value="свои очки"/>
<input type="submit" value="найти"/>
</div>
</form>

Рекомендации по использованию

  • закрывающий тег обязателен (</form>)
  • может содержать блочные элементы (за исключением самого тега <form>) и тег <script>
  • обязательный атрибут: action
  • элемент уровня блока, т.е. содержимое тега по умолчанию начинается с новой строки. После тега также добавляется перенос строки (если в свойствах блока не прописано другого)
  • некотрые браузеры добавляют отступы (margin, padding)

Применяется, как контейнер для элементов управления.

Определяет:

  • вид формы (в зависимости от содержимого)
  • программу, которая будет обрабатывать заполненную и отправленную форму — обработчик формы (указанный в атрибуте action)
  • метод отправки данных пользователя на сервер (атрибут method)
  • кодировку символов, понимаемую сервером — для обработки формы (атрибут accept-charset)
Твой код:

Результат: