当主页面关闭时关闭所有子窗口(Close all the child windows on unload of main page)
摘要：
我们常常会使用window.open的便利来实现很多常用的web功能。
在应用中，我们能够用window.opener从子页面访问并操作父页面，但如果想通过父页面管理子页面，则需要在父页面里留下存根
（因为每个子页面只有一个父页面，每个父页面却可以有多个子页面）
本例使用数组来贮存一个父页面中的所有子页面，并可对其进行操作：
Demo：当父页面关闭时关闭其所有子页面
<!
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" >
< head >
< title > Untitled Page </ title >
< script type ="text/javascript" >
<!--
var windowArray = new Array();
function openWindow(tabValue, selValue, colValue)
{
var functionReturn = true ;
try
{
var windowUrl = ' Default.aspx?TAB= ' + tabValue + ' &SEL= ' + selValue + ' &COL= ' + colValue;
var windowId = ' Hlink ' + new Date().getTime();
var windowLeft = (screen.width) ? (screen.width - 600 ) / 2 : 100;
var windowTop = (screen.height) ? (screen.height - 500 ) / 2 : 100;
var windowFeatures =
' width= ' + 600 + ' ,height= ' + 500 + ' ,top= ' + windowTop + ' ,left= ' + windowLeft +
' ,scrollbars=auto,location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=no ' ;
var windowRef = window.open(windowUrl, windowId, windowFeatures);
windowArray[windowArray.length] = windowRef;
}
catch (ex)
{
alert(ex.message);
functionReturn = false ;
}
return functionReturn;
}
function closeAllWindows()
{
for ( var i = windowArray.length - 1 ; i >= 0 ; i -- )
{
if ( windowArray.length <= 0 )
break ;
var windowRef = windowArray[i];
if ( (windowRef != null ) && (windowRef.closed == false ) )
{
windowRef.close();
}
windowArray.pop();
}
}
function Button1_onclick() {
openWindow( ' test ' , ' test ' , ' test ' );
}
function Button2_onclick() {
closeAllWindows();
}
// -->
</ script >
</ head >
< body >
< p >
< input id ="Button2" type ="button" value ="close all child" onclick ="return Button2_onclick()" />
< br />
< input id ="Button1" type ="button" value ="open a child" onclick ="return Button1_onclick()" /></ p >
</ body >
</ html >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< title > Untitled Page </ title >
< script type ="text/javascript" >
<!--
var windowArray = new Array();
function openWindow(tabValue, selValue, colValue)
{
var functionReturn = true ;
try
{
var windowUrl = ' Default.aspx?TAB= ' + tabValue + ' &SEL= ' + selValue + ' &COL= ' + colValue;
var windowId = ' Hlink ' + new Date().getTime();
var windowLeft = (screen.width) ? (screen.width - 600 ) / 2 : 100;
var windowTop = (screen.height) ? (screen.height - 500 ) / 2 : 100;
var windowFeatures =
' width= ' + 600 + ' ,height= ' + 500 + ' ,top= ' + windowTop + ' ,left= ' + windowLeft +
' ,scrollbars=auto,location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=no ' ;
var windowRef = window.open(windowUrl, windowId, windowFeatures);
windowArray[windowArray.length] = windowRef;
}
catch (ex)
{
alert(ex.message);
functionReturn = false ;
}
return functionReturn;
}
function closeAllWindows()
{
for ( var i = windowArray.length - 1 ; i >= 0 ; i -- )
{
if ( windowArray.length <= 0 )
break ;
var windowRef = windowArray[i];
if ( (windowRef != null ) && (windowRef.closed == false ) )
{
windowRef.close();
}
windowArray.pop();
}
}
function Button1_onclick() {
openWindow( ' test ' , ' test ' , ' test ' );
}
function Button2_onclick() {
closeAllWindows();
}
// -->
</ script >
</ head >
< body >
< p >
< input id ="Button2" type ="button" value ="close all child" onclick ="return Button2_onclick()" />
< br />
< input id ="Button1" type ="button" value ="open a child" onclick ="return Button1_onclick()" /></ p >
</ body >
</ html >
结束语：
关于window.open的用法，下面转载了博友阿君的文章,供大家参考：
window.open()
支持环境 JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+
语法 window.open(pageURL,name,parameters)
pageURL 子窗口路径
name 子窗口句柄
parameters 窗口参数(各参数用逗号分隔)
参数 | 取值范 | 说明
|
alwaysLowered | yes/no | 指定窗口隐藏在所有窗口之后
alwaysRaised | yes/no | 指定窗口悬浮在所有窗口之上
depended | yes/no | 是否和父窗口同时关闭
directories | yes/no | Nav2和3的目录栏是否可见
height | pixel value | 窗口高度
hotkeys | yes/no | 在没有菜单栏的窗口中设置安全退出热键
innerHeight | pixel value | 窗口中文档的像素高度
innerWidth | pixel value | 窗口中文档的像素宽度
location | yes/no | 位置栏是否可见
menubar | yes/no | 菜单栏是否可见
outerHeight | pixel value | 设定窗口(包括装饰边框)的像素高度
outerWidth | pixel value | 设定窗口(包括装饰边框)的像素宽度
resizable | yes/no | 窗口大小是否可调整
screenX | pixel value | 窗口距屏幕左边界的像素长度
screenY | pixel value | 窗口距屏幕上边界的像素长度
scrollbars | yes/no | 窗口是否可有滚动栏
titlebar | yes/no | 窗口题目栏是否可见
toolbar | yes/no | 窗口工具栏是否可见
Width | pixel value | 窗口的像素宽度
z-look | yes/no | 窗口被激活后是否可以浮在其它窗口之上
支持环境 JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+
语法 window.open(pageURL,name,parameters)
pageURL 子窗口路径
name 子窗口句柄
parameters 窗口参数(各参数用逗号分隔)
参数 | 取值范 | 说明
|
alwaysLowered | yes/no | 指定窗口隐藏在所有窗口之后
alwaysRaised | yes/no | 指定窗口悬浮在所有窗口之上
depended | yes/no | 是否和父窗口同时关闭
directories | yes/no | Nav2和3的目录栏是否可见
height | pixel value | 窗口高度
hotkeys | yes/no | 在没有菜单栏的窗口中设置安全退出热键
innerHeight | pixel value | 窗口中文档的像素高度
innerWidth | pixel value | 窗口中文档的像素宽度
location | yes/no | 位置栏是否可见
menubar | yes/no | 菜单栏是否可见
outerHeight | pixel value | 设定窗口(包括装饰边框)的像素高度
outerWidth | pixel value | 设定窗口(包括装饰边框)的像素宽度
resizable | yes/no | 窗口大小是否可调整
screenX | pixel value | 窗口距屏幕左边界的像素长度
screenY | pixel value | 窗口距屏幕上边界的像素长度
scrollbars | yes/no | 窗口是否可有滚动栏
titlebar | yes/no | 窗口题目栏是否可见
toolbar | yes/no | 窗口工具栏是否可见
Width | pixel value | 窗口的像素宽度
z-look | yes/no | 窗口被激活后是否可以浮在其它窗口之上
open新页面以后 提交本页面，刷新主页面并关闭本页面的方法
