русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

Атрибуты


Дата добавления: 2015-07-09; просмотров: 500; Нарушение авторских прав


· TYPE. Тип кнопки. Может принимать значения:

· BUTTON (просто кнопка; по умолчанию),

· SUBMIT (кнопка завершения работы и передачи данных),

· RESET (кнопка сброса).

· ONCLICK. Обработчик щелчка на кнопке.

Данный элемент не поддерживается браузером Operа 5+.

Кнопка - SUBMIT

Эта кнопка предназначена для передачи формы. В большинстве броузеров внешне почти не отличима от кнопки BUTTON. Опять же сама она не передается, а служит только для управления. Атрибут ONCLICK практически не используется, так как лучше использовать обработчик событий ONSUBMIT, заданный в тэге <FORM>. Ведь чтобы передать введенные в форму данные, в общем случае совсем не обязательно нажимать на кнопку SUBMIT. Можно просто нажать на клавиатуре клавишу ENTER, находясь в текстовом поле ввода. При этом произойдет передача данных.

Пример

<FORM>

<INPUT TYPE="SUBMIT" VALUE ="Принять заказ">

</FORM>

Атрибут VALUE дает определенные преимущества при использовании более одной кнопки передачи данных. В этом случае на основании значения полученной переменной сценарий сможет определить, как обрабатывать полученную информацию далее.

Пример

<FORM>

<INPUT TYPE="SUBMIT" NAME="BN" VALUE ="Вступить в клуб">

<INPUT TYPE="SUBMIT" NAME="BN" VALUE ="Отказаться">

<INPUT TYPE="SUBMIT" NAME="BN" VALUE ="Принять как наблюдателя">

</FORM>

Кнопка - RESET

Это кнопка очистки формы. При ее нажатии всем измененным элементам возвращается значение по умолчанию. Применяется она достаточно редко. Однако в некоторых случаях может быть весьма полезно. Совет: осторожно относитесь к выбору надписи на кнопке RESET. Вполне наглядным (и, главное, интуитивно понятным даже чайнику из чайников) будет что-нибудь вроде “Очистить”, “Начать сначала”, “Удалить ввод” и т.п. В общем, надо, чтобы у пользователя не закралось и тени сомнения относительно предназначения этой клавиши.



Пример

<FORM>

<INPUT TYPE="RESET" VALUE ="Сброс">

</FORM>

Поле ввода - TEXT

Текстовое поле ввода используется в формах наиболее часто. Более того, его можно по праву считать основным и главнейшим элементом форм. Этот тип используется тэгом <INPUT> по умолчанию, его не нужно каждый раз указывать, чтобы вывести текстовое поле. Таким образом, на каждом текстовом поле вы экономите 12 нажатий на клавиши, а главное, размер HTML-кода будет меньше. Имя поля, задаваемое атрибутом NAME, обязательно, так как базируясь именно на этом параметре, броузер передает сценарию пару имя=значение.

Пример

<FORM>

<INPUT NAME="Фамилия" VALUE ="Иванов" SIZE=20 MAXLEGNTH=20>

</FORM>

Текст Иванов помещается в созданное поле в качестве начального значения. Если пользователь не внесет изменений или нажмет кнопку RESET, то значение Иванов будет отправлено сценарию в качестве фамилии пользователя.

Поле ввода пароля - PASSWORD

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

Пример

<FORM>

<INPUT TYPE="PASSWORD" NAME="Пароль" SIZE=20>

</FORM>

Скрытое поле - HIDDEN

Это специальный (скрытый) тип текстового поля. Если один сценарий обрабатывает несколько разных форм, то в скрытом поле каждой формы можно указать идентификатор, который позволит определить, с какой формой вы имеете дело.

Пример

<FORM METHOD="POST" ACTION="/cgi_bin/test.cgi">

<INPUT TYPE="HIDDEN" NAME="NumForm" VALUE ="1">

...Другие элементы формы....

</FORM>

<FORM

METHOD="POST" ACTION="/cgi_bin/test.cgi">

<INPUT

TYPE="HIDDEN" NAME="NumForm" VALUE ="2">

...Другие элементы формы...

</FORM>

Броузер не отображает скрытое поле, хотя его можно обнаружить, если перевести броузер в режим просмотра HTML-файла и проанализировать текст HTML-страницы. Скрытые поля полезны, если необходимо указать требуемую для сценария информацию, но при этом нежелательно, чтобы пользователь имел возможность вносить в нее изменения. Однако учтите, что сообразительный пользователь может сохранить вашу форму в файле, отредактировать его, а затем передать эту форму серверу в измененном виде. Поэтому не стоит полагаться на скрытые поля с целью создания какой-либо защиты.

Пример

<INPUT TYPE="HIDDEN" NAME="FormVersion" VALUE ="1.2">

Сценарий получит переменную с именем FormVersion, которой будет присвоено значения 1.2. Эта информация может использоваться для определения способа обработки остальной информации, полученной от формы. Если пользователь изменит это значение, то программа сценария может повести себя неожиданным образом.

Флажок - CHECKBOX

Броузер отображает поле этого типа в виде небольшого квадрата. По смыслу флажок служит для того, чтобы быть установленным (квадрат перечеркнут), либо нет (квадрат пуст). Когда он установлен, его значение, заданное атрибутом VALUE, передается программе сценария. Если он не установлен, то его значение не передается совсем. Флажок может быть сразу установлен по умолчанию, если указан атрибут CHECKED. По умолчанию атрибут VALUE имеет значение ON (установлен). Так как атрибут VALUE здесь задает не надпись на флажке, а его внутреннее значение, передаваемое программе сценария, то если надо что-то подписать, пишите рядом с флажком.

Пример

<FORM>

Нужна накладная

<INPUT TYPE="CHECKBOX" NAME="Receipt" VALUE ="Yes">

</FORM>

Для задания окружающего кликабельного текста используется тег label

<label><input type="checkbox" /> флаг</label>

 

<input type="checkbox" id="flag" /><label for="flag"> флаг</label>

Атрибут for тега label — задает уникальный идентификатор, определяемый с помощью атрибута id элемента <input>, с которым следует установить связь.

Переключатель - RADIO

Переключатель напоминает флажок, поскольку он тоже может находиться во включенном или выключенном состоянии. По смыслу всегда предполагается, что в форме имеется несколько переключателей с одинаковым атрибутом NAME. У каждого из них свое значение атрибута VALUE. Группа переключателей с одним и тем же именем в форме ведет себя таким образом, что только один из них может быть включенным. При передаче данных передается значение только выбранного переключателя. Один переключатель из группы может быть изначально выбран по умолчанию с помощью атрибута CHECKED.

Пример

<FORM>

<INPUT TYPE="RADIO" NAME="Sex" VALUE ="Man" CHECKED>Мужской

<INPUT TYPE="RADIO" NAME="Sex" VALUE ="Woman">Женский

</FORM>

Файл - FILE

Позволяет передать сценарию любой файл. Максимальный размер файла задается скрытым полем MAX_FILE_SIZE.

Пример

<form name=forma enctype="multipart/form-data"

method=POST action=http://htmlweb.ru/cgi-bin/file.cgi >

<INPUT TYPE="hidden" NAME="MAX_FILE_SIZE"

VALUE ="10000" >

Фото:<INPUT TYPE="file" NAME="mURL" size=45>

</form>


Сценарий получения файла на PHP:

if (isset($mURL_type)) {

$nname='/usr/home/ftp/pub/'.$mURL_name;

if (move_uploaded_file($mURL,$nname)) {

print "Файл успешно загружен на сервер!";

mail("Admin@aaanet.ru",

"Поступил файл $nname",

"Поступил файл $nname",

"Content-Type: text/plain; charset=windows-1251");

} else

print "Ошибка! Файл не был загружен...";

exit;

}

<? EndCode(); ?>

<p>Подробнее о <a href="/php/php_upload.php">приеме - передаче файлов на PHP</a></p>

<p>В конце разговора о HTML-формах хочу сделать одно замечание.

Некоторые броузеры (например, Internet Explorer)

отображают элементы форм, даже если они не

находятся внутри контейнера &lt;FORM&gt;…&lt;/FORM&gt;. Но злоупотреблять

этим не стоит. Во-первых, в одном документе может находиться несколько форм,

и именно &lt;FORM&gt;…&lt;/FORM&gt; определяет, какие элементы к какой форме

относятся; во-вторых, в тэге &lt;FORM&gt; задается URL обработчика формы

и метод передачи данных. В этом плане корректнее всех поступает

броузер Netscate Navigator, он вообще не отображает никаких элементов

управления, описанных вне контейнера &lt;FORM&gt;…&lt;/FORM&gt;.</p>

 

 

<a name="fieldset"></a><H3>FIELDSET</H3>

<p>Этот элемент позволяет группировать элементы форм.

Данная группировка помогает пользователям проще ориентироваться в формах,

то есть ему сразу становится понятно, что вот все эти элементы относятся именно к этой форме.

Кроме того, можно эту группу еще и обозвать. Для этого используется элемент <a href='#legend'>LEGEND</a></p>

 

<p>Поддерживается браузерами: MSIE 4+, Netscape 6, Opera 5+.</p>

 

<a name="legend"></a><H3>LEGEND</H3>

<p>Имеет атрибут ALIGN, который теоретически позволяет размещать название не только сверху,

но он не работает ни в одном браузере. </p>

<p>Самое прекрасное, что на элемент FIEDLSET можно писать стили,

то есть вы можете сделать рамку любого цвета и так далее.

Надо сказать, что элемент LEGEND помечен в спецификации HTML 4 как нежелательный.</p>

<p>Ниже приведена форма, которая заключена в элемент FIELDSET и называется "Ваш комментарий".</p>

<p> </p>

[html]

<form> <br>

<fieldset style="border: 2px solid rgb(0, 0, 0);

padding: 10px; width: 200px;"> <br>

<legend>Ваш комментарий</legend>

<p>Вы можете разместить на сайте ваш комментарий,

касающийся данной статьи</p>

<br>

<table> <tbody>

<tr><td>Имя:</td><td><input size="12"></td></tr>

<tr><td>E-mail:</td><td><input size="12"></td></tr>

<tr><td>Страна:</td>

<td><select>

<option selected="selected">Россия </option>

</select></td></tr>

<tr><td colspan="2">Комментарий:<br>

<textarea rows="4" cols6=""></textarea></td></tr>

<tr><td colspan="2">

<input value="отправить" type="submit"></td></tr>

</tbody></table> <br>

</fieldset>

</form>

 



<== предыдущая лекция | следующая лекция ==>
Атрибуты | Использование языка JavaScript с HTML-формами


Карта сайта Карта сайта укр


Уроки php mysql Программирование

Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


 


Не нашли то, что искали? Google вам в помощь!

 
 

© life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.

Генерация страницы за: 0.084 сек.