На этом шаге мы приведем несколько примеров использования свойств, методов и событий объекта window.

Приведем несколько примеров, иллюстрирующих использование перечисленных на предыдущем шаге свойств, методов и событий.

Пример 1. Составим HTML-документ, демонстрирующий использование метода confirm() объекта window, который определяет, какая кнопка была нажата: OK или Отмена.

<HTML>
<HEAD>
<TITLE>Пример использования метода confirm.</TITLE>
<SCRIPT LANGUAGE= "JavaScript">
<!--
function cfrm()
{
  if (confirm("Нажмите кнопку")) 
     alert ("Нажата кнопка OK"); 
  else alert ("Нажата кнопка Отмена");
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<H2> Тестирование метода confirm.</H2>
<FORM>
<INPUT TYPE=BUTTON NAME=BUTTON1 VALUE="Нажмите кнопку" ONCLICK="cfrm();">
</FORM>
</BODY>
</HTML>

Текст этого документа можно взять здесь.

Вот кнопка для тестирования этого метода:

Если была нажата кнопка OK, то метод confirm() возвращает значение true (истина), что приводит к выводу сообщения "Нажата кнопка OK". В противном случае метод возвращает значение false (ложь), которое приводит к выводу сообщения "Нажата кнопка Отмена".

Пример 2. Составим HTML-документ, демонстрирующий использование метода prompt() объекта window. Этот метод выводит на экран окно со строкой редактирования, куда можно ввести требуемую последовательность символов. Эта последовательность помещается в заданную переменную (в нашем случае это переменная X).

Текст скрипта:

<HTML>
<HEAD>
<TITLE>Пример использования метода prompt.</TITLE>
<SCRIPT LANGUAGE= "JavaScript">
<!--
function prmt()
{
 X=prompt("Задайте текст","Текст");
 alert ("Вы ввели текст: "+X);
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<H2>Тестирование метода prompt.</H2>
<FORM>
<INPUT TYPE=BUTTON NAME=BUTTON1 VALUE="Нажмите кнопку" ONCLICK="prmt();">
</FORM>
</BODY>
</HTML>

Текст этого документа можно взять здесь.

Вот кнопка для тестирования этого метода:

Замечание. Символ + используется для склеивания (конкатенации) текста.

Пример 3. Составим HTML-документ, демонстрирующий использование события onload() объекта window. Это событие происходит после загрузки документа в окно браузера.

<HTML>
<HEAD>
<TITLE>Пример использования события оnload. </TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function window.onload()
{
 //Функция выполняется после загрузки документа.
 //Здесь задается значение строки состояния и имя окна.
 alert ("Первоначальное значение строки состояния: "+window.defaultStatus);
 alert ("Имя окна по умолчанию: "+window.name);
 //Присвоим новые значения строке состояния и имени окна.
window.defaultStatus="Значение строки состояния";
 window.name="MyName";
}
function  info()
{
 alert ("defaultStatus="+window.defaultStatus);
 alert ("Имя окна="+window.name);
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<H2> Использование обработчика события onload.</H2>
<FORM>
<INPUT TYPE=BUTTON NAME=BUTTON1 VALUE="Нажмите кнопку" ONCLICK="info();">
</FORM>
</BODY>
</HTML>

Текст этого документа можно взять здесь.

В этом примере также демонстрируется использование свойств name и defaultStatus объекта window.

Пример 4. Проиллюстрируем использование событий, возникающих при получении и потере фокуса приложением.

<HTML>
<HEAD>
<TITLE>Пример обработки событий получения/потери фокуса.</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function window.onfocus()
{ 
 //Функция выполняется при получении фокуса.
 alert ("Ура! Приложение активно!");
}
function window.onblur()
{
 //Функция выполняется при потере фокуса.
alert ("Жаль, что вы переключились на другое приложение.");
}
//-->
</SCRIPT></HEAD>
<BODY>
<H2> Использование обработчиков получения/потери фокуса.</H2>
Переключитесь на другое приложение, а потом опять вернитесь к этому приложению.
</BODY>
</HTML>

Текст этого документа можно взять здесь.

Замечания.

Обратите внимание на имена функций. Они складываются из имени объекта (window) и имени события.
В отличие от предыдущих примеров в тексте HTML-документа находятся только обработчики событий! Их вызов осуществляется автоматически при наступлении соответствующего события.

На следующем шаге мы закончим рассмотрение примеров.

Предыдущий шаг Содержание Следующий шаг