HTML <input> Тег
Пример
Простая форма HTML с двумя полями ввода и кнопкой Отправить:<form action="http://xhtml.co.il/tryit/html/html_form_submit_736.php"> Имя: <input type="text" name="fname" value="Маленькая" /> Фамилия: <input type="text" name="lname" value="Мышка" /> <input type="submit" value="Отправить" /> </form>
Определение и использование
Тег <input> используется для ввода информации пользователем.
Поля ввода могут быть представленны различными способами, в зависимости от типа атрибута. Полями ввода могут быть текстовое поле, флажки, поле пароля, радио кнопка, кнопка, и другое.
Поддержка браузеров
тег
<input> поддерживается во всех ведущих браузерахОтличия между HTML и XHTML
В HTML, тег <input> не имеет тега закрытия.
В XHTML, тег <input> должен быть соответствующе закрыт, как <input />.
Советы и комментарии
Совет: Используйте тег <label> для определения этикеток для элементов ввода.
Дополнительные атрибуты
DTD указывает, в какой HTML 4.01/XHTML 1.0 DTD допускаются атрибуты. S=Strict (строгий), T=Transitional (переходный), и F=Frameset (набор фреймов).
| Атрибут | Значение | Описание | DTD |
|---|---|---|---|
| accept | MIME_type | Определяет типы файлов, которые могут быть посланы через загрузку файлов (только для type="file") | STF |
| align | left right top middle bottom | Устаревший. Используйте стили вместо этого. Определяет выравнивание изображения ввода (только для type="image") | TF |
| alt | text | Определяет альтернативный текст для изображения ввода (только для type="image") | STF |
| checked | checked | Определяет, что элемент ввода отмечен, когда страница загружена (для type="checkbox" или type="radio") | STF |
| disabled | disabled | Определяет, что элемент ввода недоступен, когда страница загруженна | STF |
| maxlength | number | Определяет максимальную длину (в символах) для поля ввода (для type="text" или type="password") | STF |
| name | name | Определяет имя для элемента ввода | STF |
| readonly | readonly | Определяе, что поля ввода только для чтения (для type="text" или type="password") | STF |
| size | number | Определяет ширину поля ввода | STF |
| src | URL | Определяет URL изображения для показа как кнопка посылки | STF |
| type | button checkbox file hidden image password radio reset submit text | Определяет тип для элемента ввода | STF |
| value | value | Определяет значение для элемента ввода | STF |
Стандартные атрибуты
Тег<input> поддерживает следующие стандартные атрибуты:| Атрибут | Значение | Описание | DTD |
|---|---|---|---|
| accesskey | character | Определяет сочетание клавиш для доступа к элементу | STF |
| class | classname | Определяет имя класса для элемента | STF |
| dir | rtl ltr | Определяет направление текста для содержания в элементе | STF |
| id | id | Определяет уникальный id для элемента | STF |
| lang | language_code | Указывает код языка для содержания элемента | STF |
| style | style_definition | Определяет встроенный стиль для элемента | STF |
| tabindex | number | Указывает на порядок очереди при табуляции для элемента | STF |
| title | text | Определяет дополнительную информацию об элементе | STF |
| xml:lang | language_code | Указывает код языка для содержимого элементов, в документах XHTML | STF |
Более подробная информация о Стандартных атрибутах.
Атрибуты событий
Тег<input> поддерживает следующие атрибуты событий:| Атрибут | Значение | Описание | DTD |
|---|---|---|---|
| onclick | script | Скрипт выполняется когда нажимается мышка | STF |
| ondblclick | script | Скрипт выполняется когда мышка нажимается дважды | STF |
| onmousedown | script | Скрипт выполняется когда клавиша мышки нажата | STF |
| onmousemove | script | Скрипт выполняется когда указатель мышки сдвинулся | STF |
| onmouseout | script | Скрипт выполняется когда указатель мышки вышел из границ элемента | STF |
| onmouseover | script | Скрипт выполняется когда указатель мышки проходит над элементом | STF |
| onmouseup | script | Скрипт выполняется когда клавиша мышки отпущена | STF |
| onkeydown | script | Скрипт выполняется когда клавиша клавиатуры нажата | STF |
| onkeypress | script | Скрипт выполняется когда клавиша клавиатуры нажата и отпущена | STF |
| onkeyup | script | Скрипт выполняется когда клавиша мышки отпущена | STF |
| onblur | script | Скрипт выполняется когда элемент теряет фокус | STF |
| onfocus | script | Скрипт выполняется когда элемент получает фокус | STF |
| onchange | script | Скрипт выполняется, когда элемент изменен | STF |
| onselect | script | Скрипт выполняется, когда элемент выбран | STF |
Более подробная информация о Атрибуты событий.
Больше примеров
Пример 1
Форма с флажками: Форма с двумя флажками и кнопкой Отправить.<form action="http://xhtml.co.il/tryit/html/checkboxes.php" method="get"> <input type="checkbox" name="vehicle[]" value="Велосипед" /> У меня есть велосипед <input type="checkbox" name="vehicle[]" value="Машина" checked="checked" /> У меня есть машина <input type="submit" value="Отправить" /> </form>
Пример 2
Форма с радио-кнопками: Форма с двумя радио-кнопками, и кнопкой отправки.<form action="http://xhtml.co.il/tryit/html/radio.php" method="get"> <input type="radio" name="sex" value="Male" /> Мужчина <input type="radio" name="sex" value="Female" checked="checked" /> Женщина <input type="submit" value="Отправить" /> </form>
Пример 3
Как определить поле пароля.<form> Пароль: <input type="password" name="pwd" size="20" /> </form>
Пример 4
Как определить кнопку с вашим собственным текстом.<form> <input type="button" value="Пожалуйста, нажми меня!" /> </form>
Была ли эта информация полезной?
