今天用到了弹出窗口,顺便总结了一下。
1、基本的弹出窗口及属性
window.open ("page.html", "newwindow", "height=100, width=400, toolbar= no, menubar=no, scrollbars=no, resizable=no, location=no, status=no,top=100,left=300")
height:page.html的高度
width:page.html的宽度
top:page.html距离屏幕顶部的距离
left:page.html距离屏幕左边的距离
top和left就是给page.html设定位置的
window.open() 方法
语法:window.open(pageurl,name,parameters);
window对象的open()方法用于创建一个新的窗口实例,新创建的窗口的外观由参数:parameters指定。
新窗口中打开的文档由参数: pageurl指定。
系统能够根据参数:name确定的名称访问该窗口。
下表为parameters参数表:
参数 衩始值 说明
alwaysLowered yes/no 指定窗口隐藏在所有窗口之下。
alwaysRaised yes/no 指定窗口浮在所有窗口之上。
dependent yes/no 指定打开的窗口为父窗口的一个了窗口。并随父窗口的关闭而关闭。
directions yes/no 指定Navigator 2和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 在文档中包含各个 <pplet>标签的数组。
fullscreen yes / no 打开的窗体是否进行全屏显示
left pixel value 设定新窗口距屏幕左方的距离
top pixel value 设定新窗口距屏幕上方的距离
2、刷新弹出窗口
window.open重新打开一次就是了,注意第二个参数要一致
window.open("test.html","onlyWindowName");
3、打开新的弹出窗口,同时关闭旧的弹出窗口
var new_window;
function openNewWindow(){
if(new_window != null)
new_window.close();
new_window = window.open("test.html");
}
4、模态弹出窗口
主窗口
var reslut = window.showModalDialog("test.html",window,"dialogWidth:400px;dialogHeight:300px;center:yes;resizable:no;status:no;scroll:no;help:no;edge:raised");
reslut//得到的值
模态窗口中可这样返回值
window.returnValue = "hello";
window.close();
5、子窗口关闭刷新父窗口
1 history.go(0)
2 location.reload()
3 location=location
4 location.assign(location)
5 document.execCommand('Refresh')
6 window.navigate(location)
7 location.replace(location)
8 document.URL=location.href
这几个都可以刷新
比如:
父窗口
<a href="javascript:void(0)" onclick="window.open('child.html','child','width=400,height=300,left=200,top=200');">打开子窗口</a>
子窗口
<script language="JavaScript" type="text/javascript">
<!--
function refreshParent() {
//window.opener.location.href = window.opener.location.href; //这样也行
window.opener.location.reload();
if (window.opener.progressWindow)
{
window.opener.progressWindow.close();
}
window.close();
} //-->
</script>
<a href="javascript:void(0)" onclick="refreshParent()">刷新父窗口并关闭当前窗口</a>