name
- определяет имя, используемое
при передаче содержания данной формы на сервер. Этот параметр необходим для
большинства типов элемента input
и обычно используется для
идентификации поля или для группы полей, связанных
логически.align
- определяет способ вертикального выравнивания
для изображений. Используется совместно с типом image
. Полностью
аналогичен параметру ALIGN элемента IMG. По умолчанию имеет значение
bottom
.src
- задает URL-адрес картинки,
используемой при создании графической кнопки, инициирующей передачу данных.
Используется совместно с типом image
.size
-
определяет размер поля в символах.maxlength
- определяет
максимальное количество символов, которые можно ввести в текстовом поле. Оно
может быть больше, чем количество символов, указанных в параметре
size
, в этом случае поле будет прокручиваться. По умолчанию
количество символов не ограничено.checked
- указывает, что поля
типов checkbox
или radio
активизированы.value
- задает текстовый заголовок для полей
любого типа, в том числе и кнопок. Для типов, таких как checkbox
или < code>, будет возвращено значение, заданное в параметре
value
.
accept
- конкретизирует тип файла.
Используется только совместно с типом file
. Значение задается в
виде MIME.
type
- основной параметр элемента input
.
Определяет тип поля для ввода данных. Возможные значения:
Значение | Описание | Пример |
---|---|---|
<input type=text> |
Cоздает поле ввода под одну строку текста. Как правило используется
совместно с параметрами size и maxlength . |
|
<input type=textarea> |
Cоздает поле ввода для текста в несколько строк. Но для этих целей
лучше использовать элемент texarea . |
|
<input type=file> |
Дает возможность пользователю приобщить файл к текущей форме. Возможно
использование совместно с параметром accept . |
|
<input type=password> |
Cоздает поле ввода под одну строку, однако текст, вводимый пользователем, отображается в виде "звездочек", скрывая тем самым его содержание от любопытных глаз. | |
<input type=checkbox> |
Cоздает поле ввода для атрибутов типа boolean ("да"/"нет") или для
атрибутов, которые могут одновременно принимать несколько значений. Эти
атрибуты представляют собой несколько полей checkbox , которые
могут иметь одинаковые имена. Каждое выбранное поле checkbox
создает отдельную пару name/value в информации, посылаемой на
сервер, даже если результатом будут дублирующиеся имена. Поле типа
checkbox обязательно должно иметь параметры name
и value , а также необязательный атрибут
, который указывает на то, что поле
активизировано. |
можно выбрать оба варианта |
<input type=radio> |
Cоздает поле ввода для атрибутов, которые принимают одно значение из
нескольких возможных. Все радиокнопки в группе должны иметь одинаковые
имена, но только выбранная кнопка в группе создает пару
name/value , которая будет послана на сервер. Как и для полей
checkbox , атрибут checked необязателен; он может
быть использован для определения выделенной кнопки в группе кнопок. |
да нет |
<input type=image> |
Cоздает графический образ для кнопки, инициализирующей передачу данных
на сервер. Местонахождение графического изображения можно задать с помощью
параметра src . При передаче данных серверу сообщаются
координаты x и y той точки на изображении, где
был произведен щелчок клавишей мыши. Координаты измеряются из верхнего
левого угла изображения. При этом информация о поле типа
image записывается в виде двух пар значений
name/value . Значение name получается посредством
добавления к названию соответствующего поля image суффиксов
.x в случае абсциссы, и .y в случае ординаты. |
|
<input type=submit> |
Cоздает кнопку, при нажатии которой заполненная форма посылается на
сервер. Параметр value в данном случае изменяет надпись на
кнопке, содержание которой, заданное по умолчанию, зависит от браузера.
Если параметр name указан, то при нажатии данной кнопки к
информации, посылаемой на сервер, добавляется пара
name/value , указанная для для параметра submit ,
в противном случае пара не добавляется. |
|
<input type=reset> |
Cоздает кнопку, перезагружающую поля формы к их первоначальным
значениям. Надпись на кнопке может быть изменена с помощью параметра
value . По умолчанию надпись на кнопке зависит от браузера. |
|
<input type=hidden> |
Поля этого типа не отображаются на экране монитора, что позволяет
разместить "секретную" информацию в рамках формы. Содержание этого поля
посылается на сервер в виде name/value вместе с остальной
информацией формы. Этот тип может быть использован для передачи информации
о взаимодействии клиент/сервер. |
|
<input type=button> |
Позволяет создать кнопку в HTML документе, что добавляет функции при
использовании VBScript или JavaScript. Параметр name
позволяет задать имя данной кнопке, которое может быть использовано для
какой-либо функции в скрипте. Параметр value позволяет задать
текст, который будет отображен на кнопке в документе. |
legend
.align
, который теоретически позволяет размещать
название не только в верхнем левом углу, но он не работает почти ни в одном
браузере. Самое прекрасное, что на элемент fieldset
можно писать
стили, то есть вы можете сделать рамку любого цвета и так далее. Ниже приведена
форма, которая заключена в элемент fieldset
и называется "Ваш
комментарий".<form>
<fieldset style="border: 3px double steelblue; padding: 10px; width: 200px">
<legend align=center>Ваш комментарий</legend>
<p>Вы можете разместить на сайте ваш комментарий, касающийся данной статьи</p>
<table>
<tr><td>Имя:</td><td><input size=12></td></tr>
<tr><td>E-mail:</td><td><input size=12></td></tr>
<tr><td>Страна:</td><td><select>
<option selected>Беларусь
</select></td></tr>
<tr><td colspan=2>Комментарий:<br><textarea rows=4 cols=6></textarea></td></tr>
<tr><td colspan=2><input type="submit" value="отправить"></td></tr>
</table>
</fieldset>
</form>
fieldset
и legend
. Конечно, пользоваться ими надо с
умом, потому что далеко не всегда форме нужна подобная рамка.select
. В этом случае
добавляются отступы и названия каждой группы, так что пользователю при выборе
необходимого пункта ориентироваться гораздо проще. Название группы задается в
атрибуте label
элемента optgroup
. Кстати, этот элемент
браузером Opera 5+ опять же не поддерживается, так что можно с полной
уверенностью сказать, что по реализации поддержки форм Opera является худшим
браузером. Более того, каждую группу можно раскрасить в свой цвет! Делается это
очень просто. Например, первую группу сделаем зеленой, а вторую желтой. Вот
пример использования
группировки:<form>
<p>Справочники:
<select name="ask">
<optgroup label="HTML" STYLE="background: #090">
<option label="3.2">HTML 3.2
<option label="4.0">HTML 4.0
</optgroup>
<optgroup label="CSS" STYLE="background: #FF0">
<option label="1">CSS-1
<option label="2">CSS-2
<option label="3">CSS-3
</optgroup>
<option value="js">JavaScript
<option value="dhtml">DHTML
</select></p>
</form>
<<Урок 9 | ^ наверх ^ | Задание №10 | Урок 11>> |