Основы работы с XHTML и CSS

         

Атрибут value


Текстовое поле (textbox) может иметь атрибут value, определяющий предварительно введенный в поле текста. С его помощью можно задать используемое по умолчанию значение поля или указать на предполагаемое содержимое.


Рис. 11.5.  Предварительно заполненный элемент управления textbox

Name: <input type="text" id="FullName" size="30" value="Enter your full name here"/>

Листинг 11.8. Код предварительно заполненного элемента управления textbox (html, txt)


Подобно текстовым полям и текстовым областям, радио кнопки имеют связанные с вариантами выбора значения данных. Эти значения задаются явно с помощью атрибутов value, кодируемых для кнопок. Когда кнопка выбрана, ее конкретное значение ассоциируется с именем кнопки, то есть с именем, присвоенным всем кнопкам в группе. Рассмотрим следующий пример.


Рис. 11.13.  Множество кнопок для выбора цвета

What is your favorite color?<br/> <input type="radio" name="Color" value="Red"/>Red<br/> <input type="radio" name="Color" value="Green"/>Green<br/> <input type="radio" name="Color" value="Blue"/>Blue<br/>

Листинг 11.19. Код множества кнопок для выбора цвета (html, txt)

Все кнопки имеют общее имя "Color", чтобы задать группу взаимно исключающих вариантов выбора. Выбор определенного цвета из группы задается значением, связанным с выбором. Поэтому, если пользователь щелкает на первой кнопке, будет выбран цвет "Red". Более точно, значение "Red" связывается с именем "Color" как указатель выбора.

Обычно для радио кнопок всегда необходимо кодировать атрибуты value. Таким способом кнопки получают значения, а сценарий браузера или серверная программа определяет, какая кнопка была выбрана. Не обязательно присваивать значение, которое совпадает с меткой кнопки. Часто для значений используются сокращенные коды, а выводятся более содержательные метки.

What is your favorite color?<br/> <input type="radio" name="Color" value="R"/>Red<br/> <input type="radio" name="Color" value="G"/>Green<br/> <input type="radio" name="Color" value="B"/>Blue<br/>

Листинг 11.20. Код для множества, создающий "кодированный" выбор цвета (html, txt)

Выбор одной из приведенных выше кнопок отправляет имя и значение Color=R, Color=G, или Color=B программе обработки, которая затем определяет, какое предпринять действие с полученным кодом значения.




Аналогично случаю радио кнопки, значение, связанное с флажком, задается в атрибуте флажка value. Когда форму отправляют для обработки на сервер, значение связывается с именем определенного флажка. Для обработки в браузере значение связывается с id флажка. Значения не обязаны совпадать с метками. Обычно для значений применяют сокращенные коды, а более описательный текст используется для меток.




По умолчанию значение, связанное с вариантом раскрывающегося списка, задается текстовой меткой, имеющейся в теге <option>. Однако можно закодировать атрибут value, чтобы задать значение отличное от метки. Это может быть предпочтительно, когда метки являются длинными текстовыми строками, а нужно иметь только сокращенные коды значений.

Код ниже показывает основные теги и атрибуты, необходимые для создания раскрывающегося списка. Он создает список, показанный выше на рисунке 11.16.

Choose your favorite color:<br/> <select id="Color"> <option value="R">Red</option> <option value="G">Green</option> <option value="B">Blue</option> <option value="Y">Yellow</option> <option value="M">Maroon</option> <option value="P">Purple</option> <option value="A">Aqua</option> <option value="T">Teal</option> </select>

Листинг 11.25. Базовый код для раскрывающегося списка (html, txt)






Атрибут value задает для кнопки два вида идентификации. С одной стороны, это значение ассоциируется с именем кнопки и указывает сценарию на сервере, какая кнопка была нажата; с другой, это значение используется как метка кнопки. Если атрибут value не задается, кнопка помечается как "Submit Query"; однако можно задать любую текстовую строку, чтобы пометить кнопку содержательной надписью. Обычный код и вывод кнопки submit показан ниже.

<input type="submit" name="SubmitButton" value="Submit Form"/>


Рис. 11.20.  Типичный код и вывод кнопки <input type="submit"/>




Текстовое поле (textbox) может иметь атрибут value, определяющий предварительно введенный в поле текста. С его помощью можно задать используемое по умолчанию значение поля или указать на предполагаемое содержимое.


Рис. 11.5.  Предварительно заполненный элемент управления textbox

Name: <input type="text" id="FullName" size="30" value="Enter your full name here"/>

Листинг 11.8. Код предварительно заполненного элемента управления textbox




Подобно текстовым полям и текстовым областям, радио кнопки имеют связанные с вариантами выбора значения данных. Эти значения задаются явно с помощью атрибутов value, кодируемых для кнопок. Когда кнопка выбрана, ее конкретное значение ассоциируется с именем кнопки, то есть с именем, присвоенным всем кнопкам в группе. Рассмотрим следующий пример.


Рис. 11.13.  Множество кнопок для выбора цвета

What is your favorite color?<br/> <input type="radio" name="Color" value="Red"/>Red<br/> <input type="radio" name="Color" value="Green"/>Green<br/> <input type="radio" name="Color" value="Blue"/>Blue<br/>

Листинг 11.19. Код множества кнопок для выбора цвета

Все кнопки имеют общее имя "Color", чтобы задать группу взаимно исключающих вариантов выбора. Выбор определенного цвета из группы задается значением, связанным с выбором. Поэтому, если пользователь щелкает на первой кнопке, будет выбран цвет "Red". Более точно, значение "Red" связывается с именем "Color" как указатель выбора.

Обычно для радио кнопок всегда необходимо кодировать атрибуты value. Таким способом кнопки получают значения, а сценарий браузера или серверная программа определяет, какая кнопка была выбрана. Не обязательно присваивать значение, которое совпадает с меткой кнопки. Часто для значений используются сокращенные коды, а выводятся более содержательные метки.

What is your favorite color?<br/> <input type="radio" name="Color" value="R"/>Red<br/> <input type="radio" name="Color" value="G"/>Green<br/> <input type="radio" name="Color" value="B"/>Blue<br/>

Листинг 11.20. Код для множества, создающий "кодированный" выбор цвета

Выбор одной из приведенных выше кнопок отправляет имя и значение Color=R, Color=G, или Color=B программе обработки, которая затем определяет, какое предпринять действие с полученным кодом значения.




Аналогично случаю радио кнопки, значение, связанное с флажком, задается в атрибуте флажка value. Когда форму отправляют для обработки на сервер, значение связывается с именем определенного флажка. Для обработки в браузере значение связывается с id флажка. Значения не обязаны совпадать с метками. Обычно для значений применяют сокращенные коды, а более описательный текст используется для меток.




По умолчанию значение, связанное с вариантом раскрывающегося списка, задается текстовой меткой, имеющейся в теге <option>. Однако можно закодировать атрибут value, чтобы задать значение отличное от метки. Это может быть предпочтительно, когда метки являются длинными текстовыми строками, а нужно иметь только сокращенные коды значений.

Код ниже показывает основные теги и атрибуты, необходимые для создания раскрывающегося списка. Он создает список, показанный выше на рисунке 11.16.

Choose your favorite color:<br/> <select id="Color"> <option value="R">Red</option> <option value="G">Green</option> <option value="B">Blue</option> <option value="Y">Yellow</option> <option value="M">Maroon</option> <option value="P">Purple</option> <option value="A">Aqua</option> <option value="T">Teal</option> </select>

Листинг 11.25. Базовый код для раскрывающегося списка




Атрибут value задает для кнопки два вида идентификации. С одной стороны, это значение ассоциируется с именем кнопки и указывает сценарию на сервере, какая кнопка была нажата; с другой, это значение используется как метка кнопки. Если атрибут value не задается, кнопка помечается как "Submit Query"; однако можно задать любую текстовую строку, чтобы пометить кнопку содержательной надписью. Обычный код и вывод кнопки submit показан ниже.

<input type="submit" name="SubmitButton" value="Submit Form"/>


Рис. 11.20.  Типичный код и вывод кнопки <input type="submit"/>



Содержание раздела