• Свойства frames, length, parent и top применяются, когда в окно загружен HTML-документ с фреймами. Анализируя свойство length, вы можете определить количество фреймов в окне, а с помощью свойства frames (которое является массивом) получить доступ к окнам этих фреймов. Об использовании фреймов в JavaScript было подробно рассказано в гл. 5.
• Рассмотрим использование свойств объекта Window на примере сценария из листинга 10.3.
Листинг 10.3. Свойство status объекта Window<html>
<head>
<title>Свойство status объекта Window</title>
</head>
<body>
<script language="JavaScript">
window.status="ЗДЕСЬ БУДЕТ ВАШ ТЕКСТ!"
</script>
<p>Обратите внимание на текст в строке состояния вашего браузера!</p>
</body>
</html>
Сценарий позволяет изменить текст в строке состояния браузера (рис. 10.3).
Рис. 10.3. Изменение текста в строке состояния браузера
Этот механизм удобно использовать при работе со ссылками. Вместо того чтобы выводить на экран URL-ссылку, вы можете объяснять пользователю краткое содержание загружаемой по ней веб-страницы.
Среди методов, определенных для объекта Window, можно отметить методы, предназначенные для открытия новых окон и закрытия существующих, для отображения на экране диалоговых панелей с сообщениями и методы для установки таймера.
• alert() – отображение диалоговой панели Alert (Предупреждение) с сообщением и кнопкой OK.
• close() – закрытие окна.
• confirm() – отображение диалоговой панели Confirm (Подтверждение) с кнопками OK и Отмена.
• prompt() – отображение диалоговой панели Prompt (Запрос) с полем ввода.
• open() – открытие окна.
• setTimeout() – установка таймера.
• clearTimeout() – сброс таймера.
Рассмотрим практические примеры использования каждого из этих методов.
Метод alert() применяется для вывода на экран простейшей диалоговой панели, отображающей какое-либо сообщение. После вызова этого метода выполнение сценария задерживается до тех пор, пока пользователь не нажмет кнопку OK в окне с сообщением.
Пример сценария, в котором используется метод alert(), приведен в листинге 10.4.
Листинг 10.4. Использование метода alert<html>
<head>
<title>Метод alert</title>
</head>
<body>
<script language="JavaScript">
alert("Добро пожаловать!")
</script>
</body>
</html>
Приведенный в примере сценарий выдает пользователю окно с сообщением Добро пожаловать! (рис. 10.4).
Рис. 10.4. Окно с сообщением
Внимание!
При вызове метода alert() не нужно указывать объект, для которого вызывается метод, – объект Window. Если при вызове метода объект не указан, интерпретатор сценария, встроенный в браузер, предполагает, что метод относится к объекту Window. Тем не менее вы можете явно указывать объект window: window. alert(). Результат будет тем же самым.
С помощью метода confi rm() также можно отобразить на экране диалоговую панель с вашим сообщением, однако эта панель содержит две кнопки – OK и Отмена. В зависимости от того, какая кнопка будет нажата, метод возвратит значение true или false. Поэтому данный метод часто применяется в сценариях с условиями if…else.
Рассмотрим использование метода confirm() на примере сценария из листинга 10.5.
Листинг 10.5. Использование метода confirm<html>
<head>
<title>Метод confirm()</title>
<script language="JavaScript">
<!– Маскировка сценария
function okno() //функция
{
if (confirm("Вы действительно желаете закрыть окно браузера?") )
{
alert("До свидания!");
window.close();
}
else
{
alert("Tогда оставайтесь");
}
}
// Конец маскировки сценария –>
</script>
</head>
<body onLoad="okno()">
</body>
</html>
Помимо метода confirm(), в сценарии использованы методы alert() и close(). В области заголовка документа определена функция okno(). Она содержит условие и обращается к методу confirm(), который выводит на экран диалоговую панель с запросом на закрытие окна (рис. 10.5).
Рис. 10.5. Окно с запросом, выводимое методом confirm()
Если пользователь нажмет кнопку OK, метод возвратит значение true, а если кнопку Отмена – значение false.
В случае положительного ответа функция okno() вызывает методы alert() и close() для текущего объекта Window. В данном случае таким объектом является окно браузера. Метод close() позволяет закрыть текущее окно браузера, а метод alert() выдаст пользователю сообщение До свидания!. Если же пользователь нажмет кнопку Отмена, то получит окно с сообщением Тогда оставайтесь.
Примечание
Вместо объекта Window в сценарии можно указывать объект Self, так как это синоним текущего окна. Например, self.close().
Если вам необходимо получить от пользователя одну текстовую строку, то можете применить другой метод объекта Window – метод prompt(). Он отображает на экране диалоговую панель, в которой есть одно текстовое поле ввода и кнопка OK. Когда пользователь нажимает эту кнопку, метод prompt() возвращает введенную строку.
Рассмотрим пример сценария, вызывающего метод prompt() (листинг 10.6).
Листинг 10.6. Использование метода prompt()<html>
<head>
<title>Метод prompt()</title>
</head>
<body>
<script language="JavaScript">
<!– Маскировка сценария
var name = prompt("Напишите свое имя, пожалуйста","Введите имя")
document.write("Привет, "+name+ ". Спасибо, что зашли.")
// Конец маскировки сценария –>
</script>
</body>
</html>
Сценарий выдает пользователю запрос на ввод его имени (рис. 10.6).
Рис. 10.6. Окно запроса
Имя, которое ввел пользователь в окне запроса, отображается на веб-странице благодаря команде document.write.
Совет
Метод prompt() позволяет сценарию получить от пользователя только одну текстовую строку. Когда необходимо ввести сразу несколько строк, используйте форму, имеющую произвольное количество полей и кнопку завершения ввода с обработкой события onClick. Когда пользователь нажмет эту кнопку, обработчик события сможет извлечь из полей формы введенные данные.
Ранее мы рассматривали пример закрытия окна браузера с использованием метода close(). С помощью метода open() в сценарии JavaScript можно открыть новое окно браузера и загрузить в него HTML-документ или изображение для просмотра.
Синтаксис команды с использованием метода open() следующий: ореп('адрес URL', 'имя окна', сопйд='параметр 1, параметр 2, параметр 3…., параметр n').
Первый параметр метода open() задает URL-адрес HTML-документа, предназначенный для загрузки в новое окно. Например, data.html. Если загружаемая HTML-страница располагается на другом сервере, то добавьте http:// и полный адрес страницы в Интернете. Например, http://www.mysite.ru/download/javascript.html.
Второй параметр в синтаксисе метода open() определяет имя окна для использования в атрибуте target элемента A или FORM. Вы также можете указать его как пустую строку вида "". Если вам нужно, чтобы страница загружалась в маленьком окне, то данный параметр должен иметь значение joe. Необходимо будет указать joe и после атрибута target.
Параметр config показывает, что следующие атрибуты относятся к конфигурации нового окна и определяют его внешний вид.
• width – ширина окна в пикселах.
• height – высота окна в пикселах.
• toolbar – если параметр имеет значение yes или 1, окно снабжается стандартной панелью инструментов. Если же значение этого параметра равно no, то панель инструментов в новом окне не отображается.
• location – параметр определяет, будет ли отображаться поле ввода адреса HTML-документа (адресная строка).
• status – отображение строки состояния.
• menubar – отображение строки меню.
• scrollbars – отображение полос прокрутки.
• resizable – если этот параметр указан как yes или 1, пользователь сможет изменять размер вновь созданного окна.
Все атрибуты параметра config перечисляются через запятую без пробелов и заключаются в одинарные кавычки, поскольку являются подкомандами.
Примечание
Помните, что пробел для браузера означает конец команды.
Теперь рассмотрим примеры сценариев, использующих метод open() (листинги 10.7 и 10.8).
Листинг 10.7. Файл okno.html<html>
<head>
<title>Метод open()</title>
</head>
<body>
<script language="JavaScript">
<!– Маскировка сценария
window.open('okno2.html', 'joe',config='height=250,width=300,toolbar= no,menubar=no,scrollbars=no,resizable=yes,location=no,status=yes')
window.name="main window"
// Конец маскировки сценария –>
</script>
</body>
</html>
Листинг 10.8. Файл okno2.html<html>
<head>
<title>Метод open()</title>
</head>
<body>
<a href="http://www.ya.ru" TARGET="main window">Yandex</a>
<p><a href="" onClick="window.close">Щелкните, чтобы закрыть</a></p>
</body>
</html>
Сценарий в файле okno.html открывает документ okno2. html в новом маленьком окне браузера (рис. 10.7).