父面页代码:
代码如下 |
复制代码 |
<!DOCTYPE HTML PUBLIC "-//IETF//DTD LEVEL1//EN">
<html>
<head>
<title>html.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<div>
<button id="btn">open new page</button>
</div>
<script>
window.onload=function(){
var btn = document.getElementById("btn");
btn.onclick = openPage;
function openPage(){
try {
window.open('newpage.html');
}catch(e){
alert(e);
}
//alert("ok");
}
}
function show(){
document.title=new Date();
}
</script>
</body>
</html>
|
newpage.html 代码 需要打开的页面
代码如下 |
复制代码 |
<!DOCTYPE HTML PUBLIC "-//IETF//DTD LEVEL1//EN">
<html>
<head>
<title>newpage.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<button id="btn" onclick="fun()">单击</button>
<script>
function fun(){
opener.show();
}
</script>
</body>
</html>
|
关闭父窗口时关闭子窗口
在父窗口写:
代码如下 |
复制代码 |
var sonid = window.open ('"
+ url2 + "', 'newwindow', 'height=108, width=200, top="
+ top + ",left=" + left
+ ", toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, "
+ "status=no,titlebar=no,z-look=1,depended=yes,alwaysRaised=yes')
window.attachEvent("onunload", closeSonwin);
function closeSonwin()
{
sonid.close();
}
|
子父窗口互相操作取值赋值
在父窗口中:
代码如下 |
复制代码 |
var newWin=window.showModelDialog(url,window,'');
newWin.open();
|
此时参数window即是父窗口对象
在子窗口中:
需首先获取父窗口对象,然后才能使用父窗口对象。由于父窗口对象是在创建
子窗口时通过传入参数的方式传入的,因此,在子窗口中也只能通过获取窗口参数的方式获取父窗口对象。获取方式如下:
代码如下 |
复制代码 |
var parent=widnow.dialogArguments;
|
变量parent便是父窗口对象。
例如:
代码如下 |
复制代码 |
//通过子窗口提交父窗口中的表单:form1,提交后执行查询操作
var parent=window.dialogArguments;
parent.document.form1.action="QueryInfor.jsp";
parent.submit();
//刷新父页面
var parent=window.dialogArguments;
parent.location.reload();
|
//从子窗口传值到父窗口
要实现在模态子窗口中传值到父窗口,需要使用window.returnValue完成
实现方法如下:
在子窗口中:
代码如下 |
复制代码 |
//获取父窗口某字段值,对该值加一后返回父窗口
var parent=window.dialogArguments;
var x=parent.docuement.getElementById("age").value;
x=x+1;
//传回x值
window.returnValue=x;
|
在父窗口中:
代码如下 |
复制代码 |
//获取来自子窗口的值
var newWin=window.showModelDialog(url,window,'');
if(newWin!=null)
document.getElementByIdx_x("age").value=newWin;
|
//在子窗口中设置父窗口的值
在子窗口中向父窗口中传入值似乎没有直接设置父窗口中的值来得明了。直接设置父窗口中元素的值显得要更灵活一些,不过具体使用哪种方法要根据实际情况和已有的实现方式而定,因为如果使用了不切实际的方法不仅降低开发效率,也降低了执行效率,往往也会造成不优雅的实现方式和代码风格。
子窗口设置父窗口的值使用方法如下:
子窗口中:
代码如下 |
复制代码 |
var parent=window.dialogArguments;
var x=parent.document.getElementByIdx_x("age").value;
x=x+1;
//设置父窗口中age属性值
parent.document.getElementByIdx_x("age").value=x;
|
|