Текстове поле, уроки, webreference

Однорядкове текстове поле призначене для введення рядка символів за допомогою клавіатури. Синтаксис створення такого поля наступний.

Значення атрибута type для за замовчуванням визначено як text. тому його можна не вказувати явно. Таким чином, текстове поле задається просто як .

Якщо ви створюєте реальну форму, то, звичайно ж, до поля слід додати атрибути. Допустимі атрибути текстового поля перераховані в табл. 1.

Табл. 1. Атрибути однострочного текстового поля

Ім'я поля, призначене для того, щоб обробник форми міг його ідентифікувати.

Блокує поле для введення тексту і не відправляє дані на сервер.

Ідентифікатор форми для зв'язування текстового поля з елементом

.

Для текстового поля ми вказуємо значення text або взагалі не пишемо цей атрибут.

Встановлює максимальне число символів, яке може бути введено користувачем у текстовому полі. Коли ця кількість досягається при наборі, подальше введення стає неможливим. Якщо даний атрибут опустити, то можна вводити рядок довше самого поля.

Блокує поле для введення тексту.

Ширина текстового поля, яка визначається числом символів моноширинного шрифту. Зазвичай не вказують, тому що через стилі задати бажані розміри простіше і точніше.

Початковий текст, який відображається в полі.

Ім'я змінної, яка відправляється на сервер і автоматично отримує значення ltr (для тексту зліва направо) або rtl (для тексту справа наліво).

Більшість атрибутів є типовими і застосовуються до інших елементів форми. Деякі атрибути ми докладніше розглянемо в наступних уроках.

Створення текстового поля показано в прикладі 1.

Приклад 1. Текстове поле

В результаті отримаємо наступне (рис. 1).

Текстове поле, уроки, webreference

Мал. 1. Вид текстового поля в браузері

для елемента є прості правила, яких слід дотримуватися:

елемент дозволяє створити список підказок, який з'являється при наборі тексту. Подібне можна спостерігати в пошуковій системі Яндекс або Гугл, коли ви вводите пошуковий запит.

пишеться зазвичай за межами форми, кожен пункт при цьому створюється елементом

Приклад 2. Підказки для текстового поля

Результат даного прикладу показаний на рис. 2.

Текстове поле, уроки, webreference

Мал. 2. Форма текстового поля з підказками

При наборі перших букв показуються відповідні варіанти зі списку. Пункт списку можна вибрати курсором миші або за допомогою стрілок на клавіатурі і він додасться в текстове поле. При цьому можна вводити власний текст або редагувати вже доданий.