Создание на форме однострочного поля ввода
Если вы хотите, чтобы посетитель сайта ввел короткую строку текста, поместите на форму дескриптор <input> с атрибутом type, которому присвоено значение "text".
ПРАКТИКУМ
Например, два дескриптора <input> в следующем коде создают поля для ввода имени (First Name) и фамилии (Last Name), как показано на рис. 3.4.
<form name="ExampleForm">
<p>Имя: <input type="text" name="FirstName" size="15">
Фамилия: <input type="text" name="LastName" size="20"></p>
<p>[Кнопки RESET и SUBMIT формы]</p>
</form>
Рис. З.4. Форма с двумя однострочными полями ввода текста
Обратите внимание, что текстовые надписи возле каждого однострочного поля ввода на форме не входят в состав дескриптора <input>. Каждый дескриптор <input> однострочного поля ввода текста содержит следующие атрибуты:
- type. Устанавливает тип "text", который указывает Web-браузеру, что данный элемент формы представляет собой однострочное поле ввода текста.
- id. Используется для присвоения полю ввода имени. Значение атрибута id можно использовать для работы с содержимым поля ввода в сценарии, внедренном на Web-страницу. Обратите внимание, что каждый атрибут id, используемый на одной и той же странице, должен быть уникальным, т.е. на странице не могут находиться два атрибута id с одинаковыми значениями.
- name. Используется для идентификации поля ввода текста. Значение атрибута name может применяться для ссылки на значение поля ввода в сценарии, запущенном в среде Web-браузера. Значение атрибута name совместно со значением поля ввода текста передается Web-серверу при нажатии посе-тителем кнопки Submit.
- size. Длина поля ввода текста в символах.
- value. Указывает, что браузер должен поместить в поле ввода текста при его начальной визуализации на Web-странице значение, присвоенное атрибуту value.
- maxlength. Максимальное количество символов, которое посетитель может ввести в поле ввода.
- readonly. Если этот атрибут присутствует, поле ввода может получать фокус, тем не менее, посетитель не сможет менять содержимое поля.
- disabled. Если этот атрибут присутствует, поле ввода не может получать фокус и посетитель не может менять содержимое поля. Более того, при передаче результатов формы браузер не передает Web-серверу ни имени поля, ни его значения.
- tabindex. Используется для задания порядка обхода по клавише табуляции, в соответствии с которым элементы формы получают фокус. Присваивая атрибуту tabindex элементов формы значения в возрастающем порядке, вы имеете возможность указать браузеру, на какой элемент перемещать курсор (т.е. фокус) при нажатии клавиши табуляции (TAB). При каждом нажатии TAB браузер будет перемещать фокус на элемент, значение атрибута tabindex которого больше текущего на единицу.
- accesskey. Клавиша, которую посетитель может нажать вместе с клавишей ALT (или клавишами COMMAND или CONTROL в Macintosh-системе)для перехода (т.е. перемещения фокуса) на поле ввода.
Дескрипторы <input> в приведенном примере указывают Web-браузеру поместить на форму с именем "ExampleForm" два однострочных поля ввода текста (с именами "FirstName" и "LastName"). Длина поля FirstName составляет 15 символов, а поля LastName — 20 символов.
При вводе текста в однострочное поле ввода текста посетитель сайта может ввести любое количество символов. Тем не менее, Web-браузер будет выводить на экран только то количество символов, которое указано в атрибуте size дескриптора <input>. В приведенном примере, если посетитель введет в первое поле имя длиной 20 символов, на экране будут видны только 15 символов, поскольку длина поля составляет всего 15 символов. (Если необходимо ограничить количество символов, которые посетитель может ввести в поле, задайте максимально возможное количество символов в атрибуте maxlength дескриптора <input>.)