Справочники

HTML Элементы HTML Атрибуты Глобальные Атрибуты HTML События HTML MIME-типы HTML Коды языков HTMLТаблица цветов HTML ASCII HTML ISO-8859-1 HTML Windows-1251 HTML UTF-8 кирилица HTML URL для UTF-8 HTML URL для ISO-8859


 


HTML Атрибут form

Атрибут form (от англ. "form" ‒ «форма») указывает одну или несколько форм, к которой принадлежит элемент.

Синтаксис

><form id="[идентификатор]"> ... </form>
  ...
<element form="[идентификатор]">

Значения

В качестве значения данного атрибута указывается значение «идентификатора» формы, к которой привязывается элемент формы.

Значение по умолчанию

Нет.

Применяется к тегам

Элемент Атрибут
<button> form
<fieldset> form
<input> form
<keygen> form
<label> form
<meter> form
<object> form
<output> form
<select> form
<textarea> form

Примеры использования:

Атрибут form (Элемент button)

Пример HTML:

Попробуй сам
<form action="action_form.php" method="get" id="form1">
  Имя: <input type="text" name="firstname"><br>
  Фамилия: <input type="text" name="lastname">
</form>  
  <button type="submit" form="form1">Отправить</button>

Атрибут form (Элемент fieldset)

Пример HTML:

Попробуй сам
<form action="action_form.php" method="get" id="form1">
  Укажите ваш возраст: <input type="text" name="age"><br>
<input type="submit">
</form>    
<fieldset form = "form1">
  <legend>Ваши контакты:</legend>
  Имя: <input type = "text" name = "firstname"><br>
  Email: <input type = "text" name = "email"><br>
</fieldset>

Атрибут form (Элемент input)

Пример HTML:

Попробуй сам
<form action="action_form.php" method="get" id="form1">
  Имя: <input type="text" name="firstname"><br>
  <input type="submit" value="Отправить">
</form>

  Фамилия: <input type="text" name="lastname" form="form1">

Атрибут form (Элемент keygen)

Пример HTML:

Попробуй сам
<form action="action_form.php" method="get" id="form1">
  Логин: <input type="text" name="login"><br>
  <input type="submit" value="Отправить">
</form>

  Шифрование: <keygen name="security" form="form1">

Атрибут form (Элемент label)

Пример HTML:

Попробуй сам
<form action="action_form.php" id="form1">
   <input type="radio" name="sex" id="male" value="male"><br>
   <label for="female">Женский</label>
   <input type="radio" name="sex" id="female" value="female">
   <input type="submit" value="Отправить">
</form>

<label for="male" form="form1">Мужской</label>

Атрибут form (Элемент meter)

Индикатор, расположенный за пределами формы (при этом он является частью формы):

Пример HTML:

Попробуй сам
<form action="action_form.php" method="get" id="form1">
   Введите имя: <input type="text" name="firstname"><br>
   <input type="submit" value="Отправить">
</form>

<meter form="form1" name="ind" min="0" low="40" high="90" max="100" value="95"></meter>

Атрибут form (Элемент object)

Элемент <object>, расположенный за пределами формы (при этом он является частью формы):

Пример HTML:

Попробуй сам
<form action="action_form.php" method="get" id="form1">
   Введите имя: <input type="text" name="firstname"><br>
   <input type="submit" value="Отправить">
</form>

<object data="object_clock.swf" height="400" width="400" form="form1" name="obj1"></object>

Атрибут form (Элемент output)

Умножение двух простых чисел (при этом <output> является частью формы):

Пример HTML:

Попробуй сам
<form action="action_form.php" id="form1"
oninput="c.value=parseInt(a.value)*parseInt(b.value)">0
<input type="range" id="a" name="a" value="50">100
+<input type="number" id="b" name="b" value="50">
<br><br>
<input type="submit">
</form>

<output form="form1" name="c" for="a b"></output>

Атрибут form (Элемент select)

Выпадающий список, расположенный за пределами формы (при этом он является частью формы):

Пример HTML:

Попробуй сам
<form action="action_form.php" method="post" id="form1"></form>
<h2>Какой цвет Вам нравится?</h2>
<select name="color" form="c-form">
<option value="white">Белый</option>
<option value="red">Красный</option>
<option value="blue">Синий</option>
<option value="green">Зеленый</option>
</select>
<p><input type="reset" form="c-form"> <input type="submit" form="form1"></p>

Атрибут form (Элемент textarea)

Текстовое поле ввода, расположенное за пределами формы (при этом оно является частью формы):

Пример HTML:

Попробуй сам
<p>Введите текст:</p>
<textarea rows="3" cols="42" form="textForm"></textarea>
<form id="textForm">
<p><input type="reset" value="Очистить"></p>
</form>

Поддержка браузерами

Атрибут form имеет следующую поддержку браузера для каждого элемента:

Элемент
<button> 10+ 9.5+ Да 5.1+ 4+
<fieldset>
<input> 9.0+ 10.6+ Да 5.1+ 4+
<keygen> Да Да Да 6.0+ Да
<label> Да Да Да Да Да Да
<meter>
<object>
<output> Да Да Да Да Да
<select> Да Да Да Да Да
<textarea> Да Да Да Да Да

Учебник HTML

HTML уроки: HTML Атрибуты