|
Нажимаю на ссылку на дополнительный материал и дополнение к информации-меня возвращает на первую страницу лекции. Подскажите, что делать? Или дополнительный материал платный? |
Инспектор
Вы можете этот курс.
Опубликован: 19.05.2006 | Уровень: для всех | Доступ: платный
Лекция 17:
Формы
Примеры форм, содержащих ЭУ в элементе INPUT
Следующий фрагмент HTML определяет простую форму, которая даёт пользователю возможность ввести имя, фамилию, email адрес и пол. При активации кнопки submit, форма посылается программе, указанной в атрибуте action.
<FORM action="http://somesite.com/prog/adduser" method="post"> <P> First name: <INPUT type="text" name="firstname"><BR> Last name: <INPUT type="text" name="lastname"><BR> email: <INPUT type="text" name="email"><BR> <INPUT type="radio" name="sex" value="Male"> Male<BR> <INPUT type="radio" name="sex" value="Female"> Female<BR> <INPUT type="submit" value="Send"> <INPUT type="reset"> </P> </FORM>
Эта форма будет выглядеть примерно так:
В разделе элемента LABEL мы обсуждаем установку лэйблов, таких как "First name".
В этом примере, функция verify JavaScript включается при возникновении события "onclick":
<HEAD>
<META http-equiv="Content-Script-Type" content="text/javascript">
</HEAD>
<BODY>
<FORM action="..." method="post">
<P>
<INPUT type="button" value="Click Me" onclick="verify()">
</FORM>
</BODY>См. раздел "Сценарии (скрипты)" о сценариях и событиях.
В следующем примере показано, как содержимое определённого пользователем файла может пересылаться с формой. Пользователь запрашивается о его (или её) имени и списке имён файлов, содержимое которых должно быть отправлено с формой. При установке значения enctype в " multipart/form-data " содержимое каждого файла упаковывается для отправки отдельным разделом составного документа.
<FORM action="http://server.dom/cgi/handle"
enctype="multipart/form-data"
method="post">
<P>
Ваше имя? <INPUT type="text" name="name_of_sender">
Какие файлы Вы отправляете? <INPUT type="file" name="name_of_files">
</P>
</FORM>Элемент BUTTON
<!ELEMENT BUTTON - -
(%flow;)* -(A|%formctrl;|FORM|FIELDSET)
-- кнопка push -->
<!ATTLIST BUTTON
%attrs; -- %coreattrs, %i18n, %events --
name CDATA #ПРЕДПОЛАГАЕТСЯ
value CDATA #ПРЕДПОЛАГАЕТСЯ -- отсылается на сервер при отправке формы --
type (button|submit|reset) submit -- используется как кнопка формы --
disabled (disabled) #ПРЕДПОЛАГАЕТСЯ -- недоступен в этом контексте --
tabindex NUMBER #ПРЕДПОЛАГАЕТСЯ -- позиция при табуляции --
accesskey %Character; #ПРЕДПОЛАГАЕТСЯ -- символ быстрого доступа --
onfocus %Script; #ПРЕДПОЛАГАЕТСЯ -- элемент получил фокус --
onblur %Script; #ПРЕДПОЛАГАЕТСЯ -- элемент потерял фокус --
>Начальный тег: необходим, Конечный тег: необходим
Определения атрибутов
Устанавливает начальное значение кнопки.
type = submit|button|reset [CI]
Объявляет тип кнопки. Возможные значения:
- submit: создаёт кнопку submit. Это значение по умолчанию.
- reset: создаёт кнопку reset.
- button: создаёт кнопку push.
Атрибуты, определённые в другом месте
- id, class (идентификаторы документа)
- lang (язык), dir (направление текста)
- title (название элемента)
- style (инлайн-стиль)
- disabled (недоступен)
- accesskey ( символ быстрого доступа)
- tabindex (позиция при табуляции)
- onfocus, onblur, onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup (внутренние события)
Кнопки, созданные элементом BUTTON работают почти так же, как и кнопки, созданные элементом INPUT, но дают больше возможностей представления: элемент BUTTON может иметь содержимое. Например, элемент BUTTON, содержащий изображение, работает и может выглядеть как элемент INPUT, чей type установлен в "image", но элемент BUTTON может иметь содержимое.
Визуальные ПА могут представлять кнопку BUTTON с рельефом и смещением вверх/вниз при нажатии, в то время как они могут рассматривать кнопки INPUT только как "плоские" изображения.
Этот пример расширяет предыдущий, но создаёт кнопки submit и reset элементом BUTTON вместо INPUT. Кнопки содержат изображения так же, как элемент IMG.
<FORM action="http://somesite.com/prog/adduser" method="post"> <P> First name: <INPUT type="text" name="firstname"><BR> Last name: <INPUT type="text" name="lastname"><BR> email: <INPUT type="text" name="email"><BR> <INPUT type="radio" name="sex" value="Male"> Male<BR> <INPUT type="radio" name="sex" value="Female"> Female<BR> <BUTTON name="submit" value="submit" type="submit"> Send<IMG src="/icons/wow.gif" alt="wow"></BUTTON> <BUTTON name="reset" type="reset"> Reset<IMG src="/icons/oops.gif" alt="oops"></BUTTON> </P> </FORM>
Напоминаем, что авторы должны указывать альтернативный текст для элемента IMG.
Недопустимо ассоциировать карту изображений с IMG, который является содержимым элемента BUTTON.
Ирина Кириллова
