Лекция: Создание окон в JavaScript
Для создания новых окон используется метод open() объекта window. Формат вызова данного метода имеет следующий вид:
window.open(url,<имя>,<параметры>,true|false);
Параметры вызова метода имеет следующие значения:
url – строка, определяющая, адрес страницы, которая будет загружена в новое окно;
<имя> – задает имя новому окну;
<параметры> – является строкой, которая определяет отображаемые элементы в новом окне.
true|false – четвертый параметр определяет, заменит ли URL текущий адрес (значение true) в списке или будет добавлен в конец списка (значение false).
При создании нового окна можно задавать отображение тех или иных элементов окна. Значения <параметра>, с помощью которых это выполняется, представлены в таблице:
Таблица 2 – Элементы метода open()
Элемент | Значение | Описание |
directories | yes|no, 1|0 | Позволяет отобразить либо скрыть строку каталогов |
height | pixels | Указывает начальную высоту окна |
left | pixels | Указывает начальное расстояние между окном браузера и левой границей рабочего стола |
location | yes|no, 1|0 | Позволяет отобразить либо скрыть строку адреса |
menubar | yes|no, 1|0 | Позволяет отобразить либо скрыть строку меню умолчанию |
resizable | yes|no, 1|0 | Определяет, можно ли изменить размеры окна |
scrollbars | yes|no, 1|0 | Позволяет отобразить либо скрыть полосы прокрутки для документа |
status | yes|no, 1|0 | Позволяет отобразить либо скрыть строку состояния |
toolbar | yes|no, 1|0 | Позволяет отобразить либо скрыть панель инструментов |
top | pixels | Указывает начальное расстояние между окном браузера и верхней границей рабочего стола |
width | pixels | Указывает начальную ширину окна браузера |
Ниже приведен пример кода, который открывает страницу в новом окне размером 400x300 пикселов, которое не имеет ни строки статуса, ни панели инструментов, ни меню:
<html>
<head>
<script language=«JavaScript»>
<!—
function OpenWin()
{
myWin= open(«example.files/example_01.html», «displayWindow», «width=400,
height=300, status=no, toolbar=no, menubar=no»);
}
//-->
</script>
</head>
<body>
<center>
<input type=«button»
value=«Открыть новое окно»
onClick=«OpenWin()»>
</center>
</body>
</html>
В данном примере, новое окно открывается в результате нажатия на кнопку. Но часто необходимо открывать такое окно, нажатием на ссылку. Ссылка для вызова нашей функции будет выглядеть следующим образом:
<a href='javascript:OpenWin()'>Открыть новое окно</a>