Сценарий на Web-странице

Итак, мы решили развлечь читателя нашей Web-страницы. Мы предложим ему поиграть на нашей странице в игру " Угадай число". Задание на создание такой игры в Visual Basic вы уже получали раньше (16.2). Напомню условие. Компьютер загадывает число из диапазона от 1 до миллиарда. Человек должен его отгадать. Причем за наименьшее число попыток. При каждой попытке компьютер выводит номер попытки и подсказку - " мало " или " много ". Сохраняться, как того требовало задание 127, мы для простоты не будем.

Сначала запрограммируем игру не на Web-странице, а как мы привыкли - в Visual Basic. Разместим на форме:

· Кнопку cmdTry с надписью " Попытка"

· Текстовое поле txtNumber - для того, чтобы человек вводил туда очередное число

· Текстовое поле txtMessage - для слов " Много", " Мало" и " Вы угадали"

· Текстовое поле txtNumberTry - для отображения количества попыток

Вот программа:

Dim A As Long 'это число - очередная попытка человека

Dim SecretNumber As Long 'это загаданное число

Private Sub Form_Load() 'Начальные установки:

Randomize

SecretNumber = Round(1000000000 * Rnd)

txtNumber. Text = 0

txtMessage. Text = " Попыток не было"

txtNumberTry. Text = 0

End Sub

'Процедура обработки нажатия на кнопку:

Sub cmdTry_ Click ()

A = Val (txtNumber. Text) 'превращение строки в число

If A > SecretNumber Then

txtMessage. Text = " Много"

ElseIf A < SecretNumber Then

txtMessage. Text = " Мало"

Else

txtMessage. Text = " Вы угадали"

End If

txtNumberTry. Text = txtNumberTry. Text + 1 'увеличиваем счетчик числа попыток

End Sub

Программа проста и не требует пояснений. Полужирным шрифтом я выделил фрагменты текста, которые подвергнутся изменениям при программировании для Web-страницы.

Теперь приступим к программированию нашей игры на Web-странице. Вот внешний вид страницы, который мы хотим получить:

Программа для этой игры должна быть включена в HTML-документ страницы. Там она будет называться сценарием. Пишется она не совсем на Visual Basic, а на так называемом языке VBScript. Это сильно упрощенный и немного измененный Visual Basic. Поэтому простой перенос в HTML-документ программы из Visual Basic не принесет успеха. Самое интересное то, что для программирования на VBScript вам совершенно не нужно иметь на компьютере Visual Basic. На том компьютере, где будет читаться ваша страница, он тоже не нужен. Необходимое условие одно - тот, кто будет читать вашу страницу, должен делать это при помощи броузера Internet Explorer. Не думаю, чтобы это было сильным ограничением, поскольку Windows включает в себя Internet Explorer. Во всяком случае, в России подавляющее большинство пользователей Windows используют именно этот броузер.

Internet Explorer в процессе рисования вашей страницы на экране читает ее HTML-документ и наткнувшись в его тексте на сценарий, выполняет его точно так же, как Visual Basic выполняет программу при нажатии на Start. Вот такой замечательный продукт этот Internet Explorer. Мастер на все руки.

Сценарий выполняется заново каждый раз, когда вы загружаете страницу в Internet Explorer.

Вот HTML-документ нашей страницы со включенным в него сценарием:

< html>

< body bgcolor=" #FFDFFF" >

< h1> Игра " Угадайте число" < /h1>

Введите в текстовое поле < input type=" text" size=" 20" name=" txtNumber" >

число от 1 до миллиарда и нажмите кнопку " Попытка" < p>

< input type=" button" name=" cmdTry" value=" Попытка" > < p>

Результат попытки - < input type=" text" size=" 30" name=" txtMessage" > < p>

Номер попытки - < input type=" text" size=" 10" name=" txtNumberTry" > < p>

< i> Если на угадывание числа вам удалось затратить меньше 30 попыток - вы хороший математик< /i>

< script language=" VBScript" > <! -- 'СЦЕНАРИЙ

dim A 'это число - очередная попытка человека

dim SecretNumber 'это загаданное число

Randomize

SecretNumber = Round (1000000000 * Rnd)

'Начальные значения текстовых полей:

txtNumber. Value =0

txtMessage. Value = " Попыток не было"

txtNumberTry. Value =0

'Процедура обработки нажатия на кнопку:

Sub cmdTry_ OnClick ()

A = int (txtNumber. Value) 'превращение строки в число

if A> SecretNumber then

txtMessage. Value = " Много"

elseif A< SecretNumber then

txtMessage. Value = " Мало"

else

txtMessage. Value = " Вы угадали"

end if

txtNumberTry. Value = txtNumberTry. Value + 1

End Sub

--> < /script>

< /html>

Пояснения: Сценарий располагается между строками

< script language=" VBScript" > <! --

и

--> < /script>

Сравните текст сценария с текстом программы на Visual Basic. Они очень похожи. Полужирным шрифтом я выделил фрагменты сценария, которые отличают его от соответствующих фрагментов программы на Visual Basic. Так, новостью является запрет указания типа в операторах Dim. В этом случае переменные имеют тип Variant. Вместо свойства Text используется свойство Value. Вместо Click - OnClick. вместо Val - Int.

Для работы сценария необходимо было разместить на странице следующие элементы:

· КнопкуcmdTry с надписью " Попытка"

· Текстовое полеtxtNumber - для того, чтобы человек вводил туда очередное число

· Текстовое поле txtMessage - для слов " Много", " Мало" и " Вы угадали"

· Текстовое поле txtNumberTry - для отображения количества попыток

Но откуда взять эти элементы, если мы Visual Basic даже не запускали? Оказывается, размещаются они на странице средствами языка HTML. Язык VBScript для этого тоже не нужен.

Давайте не спеша читать HTML-документсверху вниз. Вот первая незнакомая строка:

Введите в текстовое поле < input type=" text" size=" 20" name=" txtNumber" >

число от 1 до миллиарда и нажмите кнопку " Попытка" < p>

Посмотрите, какая строка Web-страницы ей соответствует. Выражение

< input type=" text" size=" 20" name=" txtNumber" >

как раз и размещает в этой строке Web-страницы текстовое поле. То, что это должно быть именно текстовое поле, а не, скажем, кнопка, задает выражение input type=" text", размер по горизонтали 20 задается выражением size=" 20", а имя поля задается выражением name=" txtNumber".

В этой строке есть незнакомый нам тег - < p>. Это просто перевод строки на Web-странице.

Аналогично изложенному, следующая строка HTML-документа

< input type=" button" name=" cmdTry" value=" Попытка" > < p>

размещает в следующей строке Web-страницы кнопку (благодаря выражению input type=" button"). Надпись на кнопке задается выражением value=" Попытка".

Следующие три строки поясняются аналогично.