Основы создания сценариев, знакомство с VBScript

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

End Sub

Alert

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

Кнопки

Различают следующие виды кнопок:
- обычная кнопка (Button);
- кнопка сброса значений элементов формы (Reset):
- кнопка инициации передачи данных из формы на сервер (Submit).
Все кнопки поддерживают свойства, приведенные ниже:
Form. Очень гибкое свойство, позволяющее сослаться на родительскую форму и получить доступ к ее свойствам. Например:
Window.Document.Testform.TestButton.Form. Method = "Get"
Name.
Данное свойство позволяет определить имя объекта.
Value. Данное свойство определяет надпись, отображаемую на кнопке.
В примере (Пример 35) рассматривается Web-страница, содержащая три кнопки и одно поле ввода (Рис.12). При нажатии на кнопку Показать свойства кнопки отображается окно с текущими значениями свойств. При заполнении поля ввода и нажатии на кнопку Изменить надпись на кнопке кнопка Submit изменит свое название.
Пример 35. Работа с кнопками

Top Frame

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

Нижний фрейм

Bottom Frame

Объект 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

Example

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

Top Frame

Top Frame

Объект Window

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

DefaultStatus

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

DefauitStatus

Рис.1 Работа c методом DefaultStalus
Объект Window поддерживает ряд методов, приведенных ниже.
Alert. Служит для выдачи сообщений в специальном окне. Данный метод включает в себя один параметр, представляющий собой строку вывода, и имеет следующий вид:
Window.Alert строка_сообщения
Пример 8 демонстрирует простейшее использование метода Alert (рис.2)
Пример 8. Работа с методом Alert

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

Метод Alert

SIZE="4">Метод

Alert

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



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

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

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

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

Метод Confirm Alert

Метод

Confirm

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



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

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

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

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

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

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

Пример 10

Метод

Prompt

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

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

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

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

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

Example

Метод

Open

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

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

Window.Navigate URL

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

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

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

открытие новой страницы

Sub TestB_OnClick

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

Navigate Str

End Sub

Метод

Navigate

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

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

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

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

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

Sub Window_OnLoad

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

End Sub

Sub   TestB_OnClick

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

Alert   "YES!"

Else

Alert   "NO !"

End   If

End Sub

Event OnLoad

Event

OnLoad

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

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

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

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

Sub Window_OnUnLoad

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

End Sub

Sub   TestB_OnClick

Window.Close

End Sub

Event OnUnLoad

Event

OnUnLoad

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

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

Переключатели
Различают два вида переключателей - зависимые Radio Buttons и независимые Checkbox. Независимый переключатель, который также называется флажком. Независимые переключатели имеют свойства, приведенные ниже.
Form. Позволяет обратиться к родительской по отношению к переключателю форме, что дает возможность получить доступ к ее свойствам.
Name. Данное свойство возвращает имя, определенное атрибутом NAME тега .
Value. Это свойство возвращает строку, определенную атрибутом VALUE тега и доступно как для чтения, так и для редактирования.
Checked. Данное свойство является ключевым, поскольку задает состояние флажка. Значение свойства имеет тип Boolean. Установленному флажку соответствует True, а сброшенному -False.
В примере (Пример 36) продемонстрирована работа с независимыми переключателями (рис.13). На Web-странице приведены семь флажков и три кнопки. При выборе первой кнопки Установить все переключатели в положение True все переключатели примут значение True. Если пользователь нажмет вторую кнопку Установить все переключатели в положение False, флажки сбросят свои значения. В случае если пользователь установит лишь некоторые из переключателей в положение "включен", нажатие третьей кнопки Показать выбранные переключатели позволит вывести окно сообщения, отображающее все выбранные пользователем.
Пример 36. Работа с независимыми переключателями.

NAME="cb2" VALUE="Two">

NAME="cb3" VALUE="Three">

NAME="cb5" VALUE="Five">

NAME="cb6" VALUE="Six">

NAME="ob7" VALUE="Seven">

VALUE="Установить все переключатели в положение True">

VALUE="Установить все переключатели в положение False">

VALUE="Показать выбранные переключатели ">

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

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

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

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

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

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

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

Radio Buttons

Color of background

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

Red

NAME="ColorR" VALUE="V2">

Silver

NAME="ColorR" VALUE="V3">

Green

Поля ввода
К полям ввода относятся следующие встроенные элементы управления HTML: поле редактирования (Text Box), область редактирования TextArea. поле ввода пароля (Password). Свойства элементов управления, предназначенных для ввода текста, приведены ниже.
Form. Данное свойство позволяет обратиться к родительской форме, что дает возможность использования свойств объекта Form.
Name. Возвращает имя определенное атрибутом Name тега Свойство предназначено для чтения.
Value. Значение данного свойства доступно как для чтения, так и для редактирования. Оно содержит текст, заключенный в поле ввода текста. Следует отметить, что начальное положение области редактирования определяет тег <ТЕХТARЕА> в отличие от полей редактирования и пароля, начальное значение которых задается посредством использования тега , а именно его атрибута TEXT. Поскольку данное свойство доступно для модификации, пользователь имеет возможность программно влиять на содержимое элемента ввода текста. При работе с полем пароля следует иметь в виду тот факт, что свойство Value будет хранить введенный текст, а не звездочки, которыми заменяются вводимые символы.
С рассматриваемыми элементами управления
управления ввода текста связаны события OnBlur, OnChange, OnFocus, OnSelect.
OnBlur. Данное событие генерируется при потере фокуса элементом управления, то есть тогда, когда он перестает быть активным.
OnChange. Генерирование этого события происходит в момент потери фокуса элементом, если значение свойства Value было изменено. Следует отметить, что при программной модификации этого свойства события OnChange не возникает. OnChange удобно использовать для проверки ввода пользователя.
ОпFocus. Данное событие генерируется при активизации элемента, то есть в момент получения им фокуса ввода. При программной активизации событие OnFocus не возникает, оно является реакцией на действия пользователя.
OnSelect. Это событие возникает при выделении текста в элементе управления посредством метода Select. События не генерируются при выделении текста пользователем.
В приведенном примере (Пример 38) реализуется следующая Web-страница (рис.15). Если пользователь вводит текст в поле Текстовое поле, а затем нажимает кнопку Добавьте в текстовую область текст, введенный текст заносится в поле ввода, расположенное в верхней части страницы.
При нажатии кнопки Новая строка происходит переход в области ввода текста на следующую строку. Нажатие кнопки Выделите текстовую область приводит к выделению всего введенного текста. Поле ввода пароля Hidden Box дает возможность ввести текст, который отображается в области редактирования текста при возникновении события ОnChange.

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

Цвет

РАБОТА С ЦВЕТОМ

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

<br>

Текстовое поле

Скрытое поле
(пароль)

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


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

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

Пример 1

NAME="TestB"   VALUE = "Test">

Существует еще один сходный вариант вызова. При помощи атрибута FOR тега

Список выбора
Ниспадающий список выбора (Select) описывается посредством использования тега

NAME="element_2">

=

Рис.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 – страницу.