Alert "Вы нажали на кнопку Submit"

End Sub

</SCRIPT>

</HEAD>

<INPUT TYPE="button" NAME="TestBV"

Value="Изменить надпись на кнопке Submit">

<INPUT TYPE="button" NAME="TestB"

Value= "Показать свойства кнопки и формы">

</P>

</P>

</FORM>

</BODY>

</HTML>

Рис.12. Работа с кнопками

Кнопки

Различают следующие виды кнопок:

- обычная кнопка (Button);

- кнопка сброса значений элементов формы (Reset):

- кнопка инициации передачи данных из формы на сервер (Submit).

Все кнопки поддерживают свойства, приведенные ниже:

Form. Очень гибкое свойство, позволяющее сослаться на родительскую форму и получить доступ к ее свойствам. Например:

Window.Document.Testform.TestButton.Form. Method = "Get"

Name.

Данное свойство позволяет определить имя объекта.

Value. Данное свойство определяет надпись, отображаемую на кнопке.

В примере (Пример 35) рассматривается Web-страница, содержащая три кнопки и одно поле ввода (Рис.12). При нажатии на кнопку Показать свойства кнопки отображается окно с текущими значениями свойств. При заполнении поля ввода и нажатии на кнопку Изменить надпись на кнопке кнопка Submit изменит свое название.

Пример 35. Работа с кнопками

<HTML>

<HEAD>

Sub TestB_OnClick

NL = chr(13) + chr(10)

Str = "Имя кнопки: "

Литература

1. С.В. Глушаков, И.В. Мельников, А.С. Сурядный. Программирование в среде Windows. Учебный курс. Харьков «Фолио», Москва «АСТ». 2000.

2. Ивэн Каллахан. Ваша WEB – страница. Проблемы и решения. «Эком». М.: 2002.

3. В.В. Дунаев. Сам себе WEB – мастер. – СПб.: БХВ-Петербург; Арлит.2000.

Оглавление

Основы создания сценариев. 3

Возможности VBScript 3

Примеры применения языка VBScript 3

Объект Window.. 5

Объект Frame. 13

Объект Location. 13

Объект History. 15

Объект Document 17

Объект Element 19

Кнопки. 19

Переключатели. 21

Поля ввода. 25

Список выбора. 27

Литература. 30

Объект Document

Следует отметить тот факт, что окно, как и фрейм, может содержать лишь один данный объект.

BgColor. Данное свойство позволяет задать цвет фона документа.

FgColor. Позволяет задать цвет текста документа.

В примере (Пример 28), приведенном ниже, рассматривается страница с двумя кнопками. Одна кнопка изменяет цвет фона, а другая - цвет текста (рис. 11).

Рис. 11. Работа с объектом Document

Объект Element

Объект Element включает встроенные элементы управления HTML. Данный объект обычно является дочерним по отношения: к объекту Form.

HTML поддерживает использование кнопок, зависимых и независимых переключателей, полей ввода, списков выбора. Почти все они определяются посредством тега <INPUT>.

Объект Frame

Объект Frame подобен объекту Window, являясь, по существу, окном в окне. Поэтому данный объект имеет события, методы и свойства, уже описанные для объекта Window. Единственной темой, требующей дополнительного рассмотрения, является синтаксис ссылки из одного фрейма на другой.

Трудность заключается в том, что необходимо правильно указать порядок прохождения свойств объектов. Например, в приведенном примере (Пример) в окне броузера существует два фрейма - верхний и нижний. Имя верхнего - "ТорFrame", имя нижнего - "BottomFrame". Для того чтобы грамотно сослаться из верхнего текущего фрейма на нижний, скажем, для получения доступа к одному из свойств этого фрейма, следует сначала сослаться на родительский объект верхнего фрейма – Window, - а уж затем на нижний фрейм. Это достигается, например, такой строкой:

Top.FrameBottom… или Parent.FrameBottom. ..

Top.Frames(1)... -ссылка все на тот же нижний фрейм.

Объект History

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

Back. Данный метод позволяет вернуться на n элементов на зад. Формат выpова метода имеет следующий вид:

Window.Back n

Forward. Данный метод позволяет переместиться на n элементов вперед. Формат вызова метода Forward следующий:

Window.Forward n

Go. Метод реализует переход на элемент, заданный его порядковым номером. Метод имеет следующий синтаксис:

Window. History .Go n ,

где п - порядковый номер элемента, на который требуется осуществить переход.

Методы Bаck и Forward сходны с одноименными кнопками в окне броузера, осуществляющими переход на один документ назад и вперед соответственно.

Рассмотрим в качестве примера страницу, состоящую из двух фреймов. Верхний фрейм должен реализовывать простейшие переходы на один документ назад или на один документ вперед. В Примере 24 приведен текст HTML-кода этой странички (Пример 25 описывает HT'ML-код документа из верхнего фрейма, а Пример 26 -из нижнего).

При нажатии на кнопку New Web-Page (Рис.10) появляется окно свойства Prompt объекта Windows. В нем следует указать новый URL документа. Запрашиваемые страницы загружаются в нижний фрейм.

Рис.10. Работа с объектом Hystory

Пример 24. Установочная страница

<HTML>

<HEAD>

<TITLE>Example</TITLE>

</HEAD>

</FRAMESET>

</HTML>

Пример 25. Верхний фрейм (Frame24-1)

<HTML>

<HEAD>

<TITLE>Top Frame</TITLE>

</HEAD>

Sub NewB_OnClick

Str = Prompt("Введите URL","Timer.htm")

if Str <> Empty Then

       Top.BottomFrame.Location.Href = Str

End If

End Sub

Sub ForwardB_OnClick

Top.BottomFrame.History.Forward 1

End Sub

Sub BackB_OnClick

Top.BottomFrame.History.Back   1

End Sub

</SCRIPT>

<P ALIGN="center">

<FONT COLOR="Blue"   SIZE="4"><STRONG>

Top Frame

</STRONG></FONT>

</P>

<FORM>

<P ALIGN="center">

<INPUT   TYPE="button"   NAME="NewB"

VALUE="Новая Web-страница">

</P>

<P ALIGN="center">

<INPUT TYPE= "button" NAME="BackB"

VALUE="Назад">

<INPUT TYPE="button" NAME="ForwardB" VALUE="Вперед">

</P>

</FORM> </BODY> </HTML>

Пример 26. Нижний фрейм (Frame24-2)

<HTML>

<HEAD>

<TITLE>Нижний фрейм</TITLE>

</HEAD>

<BODY BGCOLOR="white">

<P ALIGN="center">

<FONT   COLOR="Blue"   SIZE="6"><STRONG>

Bottom Frame</STRONG></FONT>

</P>

</BODY> </HTML>

Объект Location

Данный объект хранит информацию о текущем URL.

Href. Данное свойство определяет текущий URL.

Рассмотрим пример окна в виде двух фреймов. В этом примере задача сводятся к тому, чтобы при щелчке по кнопке содержимое фреймов менялось местами. То есть содержимое верхнего фрейма помещалось в нижний и наоборот и т. д. (рис.9).

Для определения того, какой документ должен отображаться в том или ином фрейме, использована несложная составная строковая функция, приведенная ниже.

Left(Right(Top.Frames(0).Location.Href,5),1)="1"

Строка Top.Frames(0).Location.Href вернет строку текущего URL. Функция Right в приведенном примере вырезает строку из пяти символов справа: ''N.htm”? где N - последняя цифра имени файла ("1" или "2" в зависимости от того, какой документ загружен- Frame1.htm или Frame2.htm).

Пример 18. Установочный Index.htm

<HTML>

<HEAD>

<TITLE>Example</TITLE>

</HEAD>

</FRAMESET>

</HTML>

Рис. 9. Применения объекта Frame и Location

Пример 21. Frame1.htm

<html>

<HEAD>

<TITLE>Top Frame</TITLE>

</HEAD>

Sub TestB_OnClick

If Left(Right(Top.Frames(0).Location.Href,5),1)="1" Then

Top.BottomFrame.Location.Href ="Frame1.htm"

Top.TopFrame.Location.Href = "Frame2.htm"

Else

Top.BottomFrame.Location.Href ="Frame2.htm"

Top.TopFrame.Location.Href ="Frame1.htm"

End If

End Sub

</SCRIPT>

Top Frame

</STRONG></FONT>

</p>

<FORM>

<INPUT TYPE="button" NAME="TestB"

VALUE="Нажмите кнопку для перемещения фреймов">

</p>

</FORM> </BODY> </HTML>

Пример19. Frame2.htm

<html>

<HEAD>

<TITLE>Bottom Frame</TITLE> </HEAD>

Bottom Frame</Strong><font>

</p>

</BODY>

</HTML>

Объект Window

Рассмотрим свойства объекта Window.

DefaultStatus. Предоставляет возможность задать содержимое строки состояния броузера по умолчанию, то есть в случае, когда строка состояния не отображает специальное предопределенное сообщение. Пример, отображенный в Примере 7, помещает в строку состояния текст "Это пример!”(рис.1).

Пример 7. Работа c методом DefaultStalus

<HTML>

<HEAD>

DefaultStatus = "Это пример!"

</SCRIPT>

<TITLE>DefaultStatus </TITLE>

</HEAD>

<P ALIGN="center" > <FONT COLOR="#FF0000"

SIZE="4">Свойство объекта Window</FONT>

<EM><STRONG>DefauitStatus</STROMG</EM> </FONT>

</P>

</FORM> </BODY> </HTML>

Рис.1 Работа c методом DefaultStalus

Объект Window поддерживает ряд методов, приведенных ниже.

Alert. Служит для выдачи сообщений в специальном окне. Данный метод включает в себя один параметр, представляющий собой строку вывода, и имеет следующий вид:

Window.Alert строка_сообщения

Пример 8 демонстрирует простейшее использование метода Alert (рис.2)

Пример 8. Работа с методом Alert

<HTML>

<HEAD>

Sub AlertB_OnClick

Alert "Вы нажали кнопку!"

End Sub

</SCRIPT>

<TITLE>Метод Alert</TITLE> </HEAD>

<P ALIGN="center" ><FONT COLOR="#FF0000"

SIZE="4">Метод </FONT>

<EM><STRONG >Alert </STRONG ></EM ></FONT>

</P>

<P ALIGN="center" ><INPUT

TYPE="button" NAME="AlertB" VALUE="Тест на метод Alert"> </P>

</FORM> </BODY>

</HTML>

Рис.2. Работа с методом Alert

Confirm. В отличие от окна сообщения метода Alert, окно метода Confirm включает в себя не одну кнопку ОК. а две - ОК и Cancel. При выборе кнопки ОК метод возвращает логическое значение True, а при выборе кнопки Cancel - логическое значение False.

Пример 9, приведенный ниже (рис.3), реализует пример, в котором пользователь должен нажать кнопку в окне броузера. После этого надо либо подтвердить свои действия, либо отказаться от них. В первом случае появляется окно с текстом "YES!!!", а во втором -окно с сообщением "NO! ! !".

Пример 9. Работа с методом Confirm

<HTML>

<HEAD>

<SCRIPT LANGUAGE="VBScript">

Sub ConfirmB_OnClick

If Confirm ("Выберите кнопку!") Then

Alert "YES! !"

Else

Alert "NO! ! ! "

End If

End Sub

</SCRIPT>

<TITLE>Метод Confirm Alert</TITLE>

</HEAD>

<BODY BGCOLOR="#FFFFFF">

<P ALIGN="center">

<FONT COLOR="#FF0000" SIZE="4"> Метод</FONT>

<FONT COLOR="#FF0000" SIZE="5">

<EM><STRONG>Confirm</STRONG></EM></FONT>

</P>

<FORM METHOD="POST">

<P ALIGN="center" ><INPUT TYPE="button"

NAME= "ConfirmB" VALUE= "Teст_Confirm" >

</P>

</FORM> </BODY> </HTML>

Рис.3. Работа с методом Confirm

Prompt. Данный метод позволяет пользователю вывести специальное диалоговое окно, содержащее поле ввода и строку сообщения. Формат выэова метода имеет следующий вид:

строка__ввода = Prompt (строка_еообшения, вариант ввода)

Пример 10, приведенный ниже, реализует WEB-страницу, в которой пользователь, нажав кнопку, вызывает окно метода Prompt. В этом окне можно указать требуемый текст.

Введенный текст будет отображен методом Аlеrt. По умолчанию вводится слово "текст" (рис.4).

Пример 10. Работа с методом Prompt

<HTML>

<HEAD> <TITLE>Пример 10</TITLE>

<SCRIPT LANGUAGE="VBScript">

Sub TestB_OnClick

Str = Prompt("Введите текст", "Я учусь")

Alert Str

End Sub

</SCRIPT> </HEAD>

<BODY BGCOLOR="white">

<P ALIGN="center" ><FONT COLOR="#FF0000" SIZE="4">Метод</FONT>

<FONT COLOR= "#FF0000" SIZE="5">

<EM><STRONG>Prompt</STRONG></EM></FONT>

</P>

<FORM METHOD="POST">

<P ALIGN="center"><INPUT TYPE="button"

Name = "TestB" VALUE="Тест Prompt">

</P>

</FORM> </BODY> </HTML>

Рис.4 Работа с методом Prompt

Open. Данный метод позволяет создать новое окно броузера. Формат вызова метода имеет следующий вид:

Window. Open (URL, Имя_нового_окна, Параметры)

Пример 11_ Работа с методом Open (рис.5)

<HTML>

<HEAD> <TITLE>Example</TITLE>

<SCRIPT LANGUAGE="VBScript">

Sub TestB_OnClick

Options = "Toolbar=Yes, Location=Yes"

Options = Options + " , Directories=Yes"

Options = Options + " , Status=Yes"

Options = Options + ", menubar=Yes"

Options = Options + ", scrollbars=No"

Options = Options + ", resizable=Yes"

Options = Options + ", width=300"

Options = Options + ", height = 400"

Window.Open _

"http://www.worldfide.com/index.html" , "worldfide" , Options

End Sub

</SCRIPT> </HEAD>

<BODY BGCOLOR="white">

<P ALIGN="center"><FONT COLOR="FF0000" SIZE="4">Метод</FONT>

<FONT COLOR="#FF0000" SIZE="5">

<EM> <STRONG>Open</STRONG></EM></FONT>

</P><P ALIGN="center"><INPUT TYPE="button" NAME="TestB" VALUE="Нажмите кнопку для открытия">

</P>

</BODY> </HTML>

Рис.5. Работа с методом Open

Navigator. Позволяет загрузить новую страницу в окно броyзepa. Вызов метода осуществляется посредством команды:

Window.Navigate URL

Параметр URL задает адрес документа, который должен быть загружен в окно броузера.

В приведенном примере (см. Пример 14) при нажатии на кнопку появляется окно, в котором пользователю предлагается указать интересующий его URL.. По умолчанию предложен следующий URL: http://www.uefa.com. В окно броузера будет загружена страница согласно заданному URL (рис.6).

Пример 14. Работа с методом Navigate

<HTML> <HEAD> <TITLE>открытие новой страницы </TITLE>

<SCRIPT   LANGUAGE="VBScript">

Sub TestB_OnClick

Str =   Prompt("Enter URL", "http://www.uefa.com")

Navigate Str

End Sub </SCRIPT> </HEAD>

<BODY BGCOLOR="white"> <P ALIGN="center">

<FONT COLOR="#FF0000" SIZE="4">Метод</FONT>

<FONT COLOR="#FF0000"   SIZE="5">

<EM><STRONG>Navigate</STRONG></EM></FONT>

<FORM METHOD="POST">

<P ALIGN="center"><INPUT TYPE="button"

NAME="TestB" VALUE="Введите новую страницу!! ">

</FORM> </BODY> </HTML>

Рис.6. Работа с методом Navigate

OnLoad. Событие возникает сразу после загрузки документа.

В приведенном ниже примере (Пример 15) показана обработка данного события. Идея примера проста. При загрузке страницы должна появляться подсказка о действиях пользователя, которые должны быть выполнены: "Click the button and get YES!!! or "NO!!!" (рис.7).

Пример 15. Стандартная обработка события OnLoad

<HTML>

<HEAD>

<SCRIPT   LANGUAGE="VBScript">

Sub Window_OnLoad

Alert "Нажмите кнопку и введите YES! or NО! "

End Sub

Sub   TestB_OnClick

If Confirm ("Выберите кнопку!")   Then

Alert   "YES!"

Else

Alert   "NO !"

End   If

End Sub

</SCRIPT> <TITLE>Event OnLoad</TITLE>

<BODY BGCOLOR="#FFFFFF">

<P ALIGN="center"><FONT COLOR="#FF0000" SIZE="4">Event</FONT>

<FONT   COLOR="#FF0000"   SIZE="5"> <EM><STRONG>OnLoad</STRONG></EM></FONT>

<FORM METHOD="POST">

<P ALIGN="center"><INPUT TYPE="button"

NAME="TestB" VALUE="Введите YES!   or NO!>"

</FORM>

</BODY> </HTML>

Рис. 7. Стандартная обработка события OnLoad

OnUnLoad. Данное событие возникает при выгрузке документа из окна(Пример 18).

Пример 18. Стандартная обработка события OnUnLoad(рис.8)

<HTML> <HEAD>

<SCRIPT   LANGUAGE="VBScript">

Sub Window_OnUnLoad

Alert "До свидания!!!!"

End Sub

Sub   TestB_OnClick

Window.Close

End Sub

</SCRIPT>

<TITLE>Event OnUnLoad</TITLE> </HEAD>

<BODY BGCOLOR="#FFFFFF">

<P ALIGN="center"><FONT COLOR="#FF0000'

SIZE="4">Event</FONT>

<FONT   COLOR="#FF0000"   SIZE="5">

<EM><STRONG>OnUnLoad</STRONG></EM></FONT>

<FORM METHOD="POST">

<P ALIGN="center"><INPUT   TYPE="button" NAME="TestB"   VALUE="Закрыть?">

</p>

</FORM>

</BODY>

</HTML>

Рис. 8. Стандартная обработка события OnUnLoad

Основы создания сценариев

Язык сценариев VBScript используется для программирования WEB – страниц и позволяет создавать динамические многофункциональные страницы.

Чтобы составить представление о области применения VBScript, рассмотрим часто встречающуюся в службе WWW сети Internet операцию заполнения формы и отсылки данных на сервер. Если пользователь заполнит хотя бы одно поле неверно и отошлет данные, программное обеспечение сервера распознает ошибку и попросит повторить ввод. С другой строны, можно выполнить проверку данных перед их отправкой. Если поля заполнены некорректно, броузер сразу же сообщит об этом, а данные отсылаться на сервер не будут. Этот пример наглядно иллюстрирует другое достоинство выполнения сценариев на стороне клиента – пользователь, в случае неверного ввода данных, сразу будет информирован об этом, а не будет ожидать ответа от сервера как в случае обработки запроса программным обеспечением сервера.

Существует два броузера, близких по возможностям, составляющих друг другу основную конкуренцию на рынке данного вида программного обеспечения: Microsoft Internet Explorer и Netscape Navigator. Основным отличием между этими двумя броузерами является то, что броузер Netscape не поддерживает язык VBScript, но поддерживает сходный язык сценариев JavaScript, в то время как Internet Explorer работает с обоими языками.

Переключатели

Различают два вида переключателей - зависимые Radio Buttons и независимые Checkbox. Независимый переключатель, который также называется флажком. Независимые переключатели имеют свойства, приведенные ниже.

Form. Позволяет обратиться к родительской по отношению к переключателю форме, что дает возможность получить доступ к ее свойствам.

Name. Данное свойство возвращает имя, определенное атрибутом NAME тега <INPUT>.

Value. Это свойство возвращает строку, определенную атрибутом VALUE тега <INPUT> и доступно как для чтения, так и для редактирования.

Checked. Данное свойство является ключевым, поскольку задает состояние флажка. Значение свойства имеет тип Boolean. Установленному флажку соответствует True, а сброшенному -False.

В примере (Пример 36) продемонстрирована работа с независимыми переключателями (рис.13). На Web-странице приведены семь флажков и три кнопки. При выборе первой кнопки Установить все переключатели в положение True все переключатели примут значение True. Если пользователь нажмет вторую кнопку Установить все переключатели в положение False, флажки сбросят свои значения. В случае если пользователь установит лишь некоторые из переключателей в положение "включен", нажатие третьей кнопки Показать выбранные переключатели позволит вывести окно сообщения, отображающее все выбранные пользователем.

Пример 36. Работа с независимыми переключателями.

<HTML>

<HEAD>

Sub TestS_OnClick

For x = 0 to 6

Document.TestForm.Elements(x).Checked = True

End Sub

Sub TestC_OnClick

For x = 0 to 6

Document.TestForm.Elements(x).Checked = False

End Sub

Sub TestF_OnClick

NL = chr(13) + chr(10)

Str = "Выбраны переключатели:" + NL

For x=0 to 6

If Document.TestForm.Elements(x).Checked Then

Str = Str + Document.TestForm.Elements(x). _

Value + NL

End If

Alert Str

End Sub

</SCRIPT>

</HEAD>

<BODY>

Рис.13. Работа с независимыми переключателями.

Зависимые переключатели имеют те же свойства, что и независимые.

Следует отметить, что при работе с зависимыми переключателями обработчик события OnClick нельзя называть по совокупности имени элемента и названия события. Это связано с тем, что зависимые переключатели одной группы имеют общее имя. Вместо этого обработчик события OnClick должен быть выполнен по аналогии с примером, приведенным в Примере 37.

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

виду. Параметр IndexR передается обработчику и позволяет определить, на каком переключателе был выполнен щелчок (рис.14).

Рис.14. Работа с зависимыми переключателями

Пример 37. Работа с зависимыми переключателями

<HTML> <HEAD>

<SCRIPT LANGUAGE="VBScript">

Sub RadioColor(indexR)

if indexR = 0 then Document.BgColor = "Red"

if indexR = 1 then Document.BgColor = "Silver"

if indexR = 2 then Document.BgColor = "Green"

End Sub

Sub DefaultB_OnClick

Document.BgColor = "White"

Document.Forms(0).Elements(0).Checked = True

End Sub

</SCRIPT>

<TITLE> Radio Buttons </TITLE>

</HEAD>

<BODY BGCOLOR="White">

<FORM METHOD="POST">

<P ALIGN="center">

<FONT COLOR="Blue" SIZE="6"> Color of background

</FONT>

<P ALIGN="center"> <INPUT TYPE="radio" ONCLICK="RadioColor(0)"

CHECKED NAME="ColorR" VALUE="V1">

<FONT SIZE="4">Red</FONT>

<BR> <INPUT TYPE="radio" ONCLICK="RadioColor (1)"

NAME="ColorR" VALUE="V2">

<FONT SIZE="4">Silver</FONT>

<BR> <INPUT TYPE="radio" ONCLICK="RadioColor(2)"

NAME="ColorR" VALUE="V3">

<FONT SIZE="4">Green</FONT>

<P ALIGN="center">

<INPUT TYPE="button" NAME= "DefaultB" VALUE= "Default">

</P>

</FORM>

</BODY>

</HTML>

Поля ввода

К полям ввода относятся следующие встроенные элементы управления HTML: поле редактирования (Text Box), область редактирования TextArea. поле ввода пароля (Password). Свойства элементов управления, предназначенных для ввода текста, приведены ниже.

Form. Данное свойство позволяет обратиться к родительской форме, что дает возможность использования свойств объекта Form.

Name. Возвращает имя определенное атрибутом Name тега <INPUT> Свойство предназначено для чтения.

Value. Значение данного свойства доступно как для чтения, так и для редактирования. Оно содержит текст, заключенный в поле ввода текста. Следует отметить, что начальное положение области редактирования определяет тег <ТЕХТARЕА> в отличие от полей редактирования и пароля, начальное значение которых задается посредством использования тега <INPUT>, а именно его атрибута TEXT. Поскольку данное свойство доступно для модификации, пользователь имеет возможность программно влиять на содержимое элемента ввода текста. При работе с полем пароля следует иметь в виду тот факт, что свойство Value будет хранить введенный текст, а не звездочки, которыми заменяются вводимые символы.

С рассматриваемыми элементами управления

управления ввода текста связаны события OnBlur, OnChange, OnFocus, OnSelect.

OnBlur. Данное событие генерируется при потере фокуса элементом управления, то есть тогда, когда он перестает быть активным.

OnChange. Генерирование этого события происходит в момент потери фокуса элементом, если значение свойства Value было изменено. Следует отметить, что при программной модификации этого свойства события OnChange не возникает. OnChange удобно использовать для проверки ввода пользователя.

ОпFocus. Данное событие генерируется при активизации элемента, то есть в момент получения им фокуса ввода. При программной активизации событие OnFocus не возникает, оно является реакцией на действия пользователя.

OnSelect. Это событие возникает при выделении текста в элементе управления посредством метода Select. События не генерируются при выделении текста пользователем.

В приведенном примере (Пример 38) реализуется следующая Web-страница (рис.15). Если пользователь вводит текст в поле Текстовое поле, а затем нажимает кнопку Добавьте в текстовую область текст, введенный текст заносится в поле ввода, расположенное в верхней части страницы.

При нажатии кнопки Новая строка происходит переход в области ввода текста на следующую строку. Нажатие кнопки Выделите текстовую область приводит к выделению всего введенного текста. Поле ввода пароля Hidden Box дает возможность ввести текст, который отображается в области редактирования текста при возникновении события ОnChange.

Работа с цветом

<HTML>

<Head>

Dim A(14)

A(0) = "WHITE"

A(1) = "BLACK"

A(2) = "BLUE"

A(3) = "RED"

A(4) = "YELLOW"

A(5) = "AQUA"

A(6) = "RED"

A(7) = "GRAY"

A(8) = "LIME"

A(9) ="MAROON"

A(l0)= "NAVY"

A(11)= "OLIVE"

A(12)= "PURPLE"

A(13) = "SILVER"

A(14)= "TEAL"

I = 0

J = 1

Document.BgColor = A(I)

Document.FgColor = A(J)

Sub Foreb_Onclick

If I = 14 THEN

I=0

end If

I = I + 1

Document.FgColor = A(I)

End Sub

Sub GROUNDB_Onclick

If J=14 THEN

J=0

end If

J = J + 1

Document.BgColor = A(J)

End Sub

</Script>

</Head>

<BODY>

<H2> РАБОТА С ЦВЕТОМ </H2>

<Form>

<P>

</Form>

</CENTER>

</Body>

</HTML>

Работа с полями ввода.

<HTML>

<HEAD>

Sub TestB1_OnClick

Document.TestForm.TestTA.Value =Document.TestForm.TestTA.Value + _

Document.TestForm.TestT1.Value

Document.TestForm.TestT1.Value = ""

End Sub

Sub TestB2_OnClick

Document.TestForm.TestTA.Value = Document.TestForm.TestTA.Value + _

chr(13) + chr(10)

End Sub

Sub TestB3_OnClick

Document.TestForm.TestTA.Select

End Sub

Sub TestT2_OnChange

Document.TestForm.TestTA.Value = Document.TestForm.TestTA.Value + _

Document.TestForm.TestT2.Value

Document.TestForm.TeatT2.Value = ""

End Sub

</SCRIPT>

</HEAD>

</TEXTAREA>

</P>

<STRONG>Текстовое поле</STRONG></FONT><BR>

<STRONG>Скрытое поле

(пароль)</STRONG> </FONT> <BR>

</P>

<INPUT TYPE="button" NAME="TestB1"

Value="Добавьте в текстовую область текст">

</P>

</FORM>

</BODY>

</HTML>

Рис. 15. Работа с полями ввода

ы применения языка VBScript

Если для задания программного сценария используется VBScript, следует указать строку вида:

Размещение сценария в HTML-документе имеет несколько альтернативных решений. Наиболее часто его программный код располагают между тегами <HEAD> и </HEAD>. При этом сценарий выглядит как в Примере 1, приведенном ниже. Также код сценария может быть размещен в пределах теговой пары <BODY>, </BODY>.

Существует несколько способов вызова сценария. Наиболее используемый и характерный для Visual Basic основывается на объявлении процедуры, имя которой состоит из имени элемента управления и названия события, обрабатываемого процедурой, разделенных символом подчеркивания. Использование этого способа вызова сценария продемонстрировано в Примере 1. Название "'button "- кнопки - TestB составляет первую часть имени процедуры TestB_OnClick. а вторая часть имени состоит из названия события — OnCIick. генерирующегося при нажатии на эту кнопку. Описанная таким образом процедура будет выполняться всякий раз при нажатии пользователем кнопки.

Пример 1. Расположение кода сценария в теговой nape <HEAD>, </HEAD>

<HTML>

<HEAD> <TITLE>Пример 1</TITLE>

Sub TestB_OnClick

Alert "ДА!"

End Sub

</SCRIPT> </HEAD>

<BODY BGCOLOR="White"> <P ALIGN="Center" ><INPUT TYPE="button"

NAME="TestB" VALUE = "Test"></P> </BODY>

</HTML>

Существует еще один сходный вариант вызова. При помощи атрибута FOR тега <SCRIPT> можно задать элемент управления, обработчик события которого располагается непосредственно под тегом <SCRIPT>, а само событие объявляется атрибутом EVENT, как показано в Примере 4.

Пример 4. Использование атрибутов FOR и EVENT

тега <SCRIPT>

<HTML>

<HEAD>

<TITLE>Пример 4</TITLE>

</HEAD>

<SCRIPT FOR ="TestB" EVENT="OnClick"

LANGUAGE="VBScript">

Alert "ДА!!"

</SCRIPT>

</BODY>

</HTML>

Список выбора

Ниспадающий список выбора (Select) описывается посредством использования тега <SELECT>. Причем каждый из доступных предлагаемых вариантов должен быть определен тегом <OPTION>.

Элемент управления Select имеет большой набор свойств, приведенных ниже.

Form. Данное стандартное свойство элементов управления позволяет сослаться на родительскую форму, что обеспечивает доступ к ее свойствам.

Length. Свойство позволяет определить количество элементов, отображенных в списке выбора, совпадающее с числом тегов <ОРТION> и количеством элементов в массиве Options, речь о котором пойдет ниже.

Name. Свойство возвращает имя элемента управления Select, заданное посредством атрибута Name его одноименного тега.

SelectIndex. Это свойство позволяет установить индекс выбранного элемента массива Options. Следует учитывать, что нумерация элементов начинается с нуля.

Options. Данное свойство позволяет сослаться на набор Options, который содержит массив элементов списка выбора. Иначе говоря, элементами массива являются предлагаемые варианты, каждый из которых заключен в теге <OPTION>.

Объект Options, в свою очередь, также имеет свои свойства.

DefaultSelected. Свойство служит для определения элемента, выбранного по умолчанию. HTML-код позволяет создать вариант выбора по умолчанию посредством атрибута SELECTED тега <OPT1ON>. Если при описании SELECTED не использовался, значит свойство DefaultSelected возвращает False, в противном случае True.

Length. Данное свойство аналогично одноименному свойству объекта Select.

Selected. Значение этого свойства - нуль либо единица в зависимости от того, выбран данный элемент или нет. Это свойство очень удобно использовать при работе с возможностью множественного выбора. В этом случае, последовательно анализируя свойство Selected для каждого из элементов массива, можно выявить все отмеченные варианты.

SelectedIndex. Данное свойство набора Options идентично одноименному свойству объекта Select.
Однако необходимо учитывать, что при множественном выборе SelectedIndex возвращает лишь индекс первого элемента из выбранных.

Text.

Свойство позволяет определить строковое значение, установленное тегом <OPTIONS>. Вообще говоря, именно из этих строк и состоит ниспадающий список выбора.

Два события, определенных над встроенным элементом управления Select, приведены ниже.

OnFocus.

Генерируется при активизации списка выбора. Вызов метода Focus не приводит к возникновению события OnFocus.

OnChange.

Данное событие генерируется при выборе любого другого элемента из ниспадающего списка.

Также элемент управления Select поддерживает два метода.

Blur. Позволяет деактивизировать элемент, то есть лишить его фокуса. Однако неизвестно, какой элемент станет активным после вызова данного метода. В связи с этим считается более логичным и последовательным передать фокус явно одному из неактивных элементов управления.

Focus. Данный метод позволяет передать фокус элементу Select без генерирования события OnFocus.

Приведенный ниже пример (Пример 39) иллюстрирует использование списка выбора при работе простейшего калькулятора (Рис.16). Для работы калькулятора заведены три поля ввода, один список выбора и две кнопки. Два первых поля ввода позволяют задать необходимые операнды. Список выбора дает возможность указать требуемую операцию. Первая кнопка, Calculate. обеспечивает вывод результата вычислений в третьем поле ввода. Кнопка Clear приводит форму в исходное состояние.

Пример 39. Использование списка выбора

<HTML>

<HEAD>

<TITLE> пример использования поля для выбора</TITLE>

<SCRIPT Language="VBScript">

Sub Calculate_OnClick

znak = Document.Calc.Sign.Options _

(Document.Calc.Sign.SelectedIndex).Text

elem1 = Document.Calc.element_1.Value

elem2 = Document.Calc.element_2.Value

elem1 = CDbl(elem1)

elem2 = CDbl(elem2)

Select Case znak

Case "+"

res = elem1+elem2

Case "-"

res = elem1-elem2

Case "*"

res = elem1*elem2

Case "/"

res = elem1/elem2

Case "^"

res = elem1^elem2

Case "ln"

res = LOG(elem1)

End Select

Document.Calc.Result.Value=res

End Sub

</SCRIPT>

</HEAD>

<BODY BGCOLOR="#FFFFFF">

<P ALIGN="center">

<FONT COLOR="Red" SIZE="5">

Калькулятор </FONT>

</P>

<FORM NAME="Calc">

<P ALIGN="center">

<INPUT TYPE="text" NAME="element_1">

<BR>

<SELECT NAME="Sign" sizе="1">

<OPTION>+

<OPTION>-

<OPTION>*

<OPTION>/

<OPTION>^

<OPTION>ln

</SELECT> <BR>

<INPUT TYPE="text" SIZE="11"

NAME="element_2">

<BR>

=

<BR>

<INPUT TYPE="text" SIZE=”20” NAME="result">

</P>

<P ALIGN="center">

<INPUT TYPE="button" NAME ="Calculate" VALUE="Вычислить">

</P>

<P ALIGN="center">

<INPUT TYPE="reset" NAME="Сброс"

</P>

</FORM>

</BODY>

</HTML>

Рис.16. Работа со списком выбора

Str = Str & Document.TestForm.Tests. Name & NL

Str = Str & " Элементов формы: "

Str = Str & Document.TestForm. Tests.Form.Elements.Length & NL

Str = Str & "Надпись: "

Str = Str & Document.TestForm.TestS.Value

x = MsgBox(str,0, "Test Button Properties")

End Sub

Sub TestBV_OnClick

Возможности VBScript

Область применения VBScript достаточно широка. Сюда относится работа с самими HTML-документами, создание динамических документов, работа с броузером, использование элементов управления ActiveX и многое другое.

Под работой с самим HTML-документом следует понимать управление объектами документа. VBScript позволяет получать информацию о свойствах объекта, а также изменять их.

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