Объект окна является объектом верхнего уровня в объектной модели браузера JavaScript и содержит несколько общих методов и свойств:
1 Открыть новое окно
Скопируйте код кода следующим образом:
window.open(URL-страницы, имя, параметры)
в:
pageURL — путь дочернего окна.
name — дескриптор дочернего окна
Параметры — параметры окна (каждый параметр разделяется запятыми).
нравиться:
Скопируйте код кода следующим образом:
window.open("http://www.cnblogs.com/zhouhb/","open",'height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars= нет, изменяемый размер = нет, местоположение = нет, статус = нет');
2 Откройте модальное окно
Скопируйте код кода следующим образом:
window.showModalDialog("http://www.cnblogs.com/zhouhb/","open","toolbars=0;width=200;height=200");
3 Закройте окно, не открывая окно подсказки.
Если веб-страница не открывается с помощью программы-скрипта (window.open()), перед вызовом сценария window.close() для закрытия окна объект window.opener должен быть установлен в значение null, в противном случае браузер (IE7, IE8) появится сообщение «ОК». Закройте диалоговое окно.
Скопируйте код кода следующим образом:
<script Language="JavaScript">
функция закрытия окна()
{
window.opener = ноль;
window.open('', '_self', '');
окно.закрыть();
}
</скрипт>
<input type='button' value='Закрыть окно' onClick="closeWindow()">
или
<input type="button" value="Закрыть окно" onClick="window.opener = null;
window.open('', '_self', '');window.close()">
Для закрытия окна рамы
Скопируйте код кода следующим образом:
<script Language="JavaScript">
функция закрытия окна()
{
window.opener = ноль;
window.open('', '_top', '');
окно.родитель.закрыть();
}
</скрипт>
4. Использование объекта локации.
Скопируйте код кода следующим образом:
window.location.reload();//Обновляем текущую страницу
window.location.href="http://www.cnblogs.com/zhouhb/" //Загрузить другие страницы
5 Использование объекта истории
Скопируйте код кода следующим образом:
окно.история.go(1); //Вперед
окно.история.go(-1); //Назад;
6 Дочерняя форма передает значения родительской форме
6.1 Простой метод
(1) Откройте подчиненную форму в родительской форме.
Скопируйте код кода следующим образом:
var str=window.showModalDialog("s.html");
если (строка! = ноль)
{
var v=document.getElementById("v");
v.value+=str;
}
(2) Код подчиненной формы
Скопируйте код кода следующим образом:
var v=document.getElementById("v");
window.parent.returnValue=v.value;
окно.закрыть();
Кроме того, для окна, открываемого showModalDialog, вы также можете передавать значения через диалогАргументы:
Код родительского окна:
Скопируйте код кода следующим образом:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<голова>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
<тип сценария="текст/javascript">
функция opendialog()
{
window.showModalDialog("child.html",window,"win","resable=false");//Здесь объект окна передается в качестве параметра
}
</скрипт>
</голова>
<тело>
<форма>
<input type="text" id="name" />
<input type="button" id="open" value="open" onclick="opendialog()"/>
</форма>
</тело>
</html>
Код подокна:
Скопируйте код кода следующим образом:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<голова>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
<тип сценария="текст/javascript">
функция обновленияРодитель()
{
var pwin=window.dialogArguments;//Дочернее окно получает переданные параметры
если(pwin!=не определено)
{
pwin.document.getElementById("имя").value=document.getElementById("имя").value;
}
}
</скрипт>
</голова>
<тело>
<форма>
<input type="text" id="name" />
<input type="button" id="update" value="Обновить родительское окно" onclick="updateParent()"/>
</форма>
</тело>
</html>
Для окна, открытого с помощью showModalDialog, вы также можете передать значение через window.returnValue:
Главное окно:
Скопируйте код кода следующим образом:
<SCRIPT type="text/javascript">
функция openWindow(){
var bankCard=window.showModalDialog("counter.html","","dialogWidth=400px;dialogHeight=200px");
alert("Пароль вашей банковской карты: "+bankCard+"/n");
}
</СКРИПТ>
(2) Открыть окно
Скопируйте код кода следующим образом:
<ГЛАВА>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>Упражнения</TITLE>
<SCRIPT type="text/javascript" Language="javascript">
функция closeWindow(){
window.returnValue=document.myform.cardPass.value;
окно.закрыть();
}
</СКРИПТ>
</HEAD>
<ТЕЛО>
<FORM name="myform" action="" метод="post">
Информация об аккаунте:<BR>
Пожалуйста, храните данные своей учетной записи правильно, чтобы избежать потерь<BR>
Номер счета: <INPUT name="cardNum" type="text" size="40"><BR>
Пароль: <INPUT name="cardPass" type="password" size="45"><BR>
<INPUT type="button" name="btn" value="Confirm" onClick="closeWindow()">
</ФОРМ>
</ТЕЛО>
6.2 Более подробное введение
Как мы все знаем, функцию window.open() можно использовать для открытия нового окна, так как же передать значение родительской форме в дочерней форме? Фактически, вы можете получить ссылку на родительскую форму через окно? .открывалка.
Например, если мы создадим новую форму FatherPage.htm:
Скопируйте код кода следующим образом:
<тип сценария="текст/javascript">
функцияOpenChildWindow()
{
window.open('ChildPage.htm');
}
</скрипт>
<input type="text" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />
Затем в ChildPage.htm вы можете получить доступ к элементам родительской формы через window.opener:
Скопируйте код кода следующим образом:
<тип сценария="текст/javascript">
функция УстановитьЗначение()
{
window.opener.document.getElementById('txtInput').value
=document.getElementById('txtInput').value;
окно.закрыть();
}
</скрипт>
<input type="text" id="txtInput" />
<input type="button" value="SetFather" onclick="SetValue()" />
Фактически, открывая подформу, мы также можем присваивать значения элементам подформы, поскольку функция window.open также будет возвращать ссылку на подформу, поэтому FatherPage.htm можно изменить так:
Скопируйте код кода следующим образом:
<тип сценария="текст/javascript">
функцияOpenChildWindow()
{
var child = window.open('ChildPage.htm');
child.document.getElementById('txtInput').value
=document.getElementById('txtInput').value;
}
</скрипт>
<input type="text" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />
Определив, пуста ли ссылка на подформу, мы также можем контролировать ее открытие только одной подформы:
Скопируйте код кода следующим образом:
<тип сценария="текст/javascript">
вар ребенок
функцияOpenChildWindow()
{
если(!ребенок)
ребенок = window.open('ChildPage.htm');
child.document.getElementById('txtInput').value
=document.getElementById('txtInput').value;
}
</скрипт>
<input type="text" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />
Одного этого недостаточно. При закрытии дочерней формы необходимо также очистить дочернюю переменную родительской формы. В противном случае дочернюю форму невозможно открыть повторно после ее открытия и последующего закрытия:
Скопируйте код кода следующим образом:
<body onunload="Выгрузить()">
<тип сценария="текст/javascript">
функция УстановитьЗначение()
{
window.opener.document.getElementById('txtInput').value
=document.getElementById('txtInput').value;
окно.закрыть();
}
функцияВыгрузить()
{
window.opener.child = ноль;
}
</скрипт>
<input type="text" id="txtInput" />
<input type="button" value="SetFather" onclick="SetValue()" />
</тело>