| Элемент | ||||||
| <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 Атрибут 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 имеет следующую поддержку браузера для каждого элемента:
Учебник HTML
HTML уроки: HTML Атрибуты
