您的位置：首页 > 运维架构

window.open打开子页面，并选择回填的数据到父页面，替换了div弹出层的形式

2016-09-15 14:02 645 查看
父窗口：father.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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>父窗口</title>
<script type="text/javascript">

function opens(){
var obj = window;
obj.name = "我是父窗口"; //子窗口获得的是这个
var openUrl = "sun.html";//弹出窗口的url
var iWidth=800; //弹出窗口的宽度;
var iHeight=400; //弹出窗口的高度;
var iTop = (window.screen.availHeight-30-iHeight)/2; //获得窗口的垂直位置;
var iLeft = (window.screen.availWidth-10-iWidth)/2; //获得窗口的水平位置;
myWindow =window.open(openUrl,"Child","height="+iHeight+", width="+iWidth+", top="+iTop+", left="+iLeft+",alwaysRaised=yes,z-look=yes,location=yes");
myWindow.focus(); //置顶
//window.showModalDialog();
/****
var obj = window;
obj.name = "我是父窗口"; //子窗口获得的是这个
myWindow = window.open("sun.html","Child","width=400px,height=400px"); //第二个参数的话 就只能打开一个
myWindow.document.getElementById("namez").value="我来自父窗口";
myWindow.focus();
*/
}
</script>
</head>

<body>
<input type="text" name="namef" id="namef" value="ffffff" onclick="opens()"/><br/>
<input type="text" name="telf" id="telf" value=""/>

</body>
</html>
<!--
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 | 窗口被激活后是否浮在其它窗口之上
-->


子窗口：sun.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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>子窗口</title>
<script type="text/javascript">
window.onload=function(){
//document.getElementById("namez").value = this.opener.name;//获取父窗口变量(我是父窗口)
}
function tianjia(){
var temp = document.getElementById("namez").value;
this.opener.document.getElementById("telf").value = temp;//控制父窗口
//document.getElementById("namez").value = this.opener.name;//获取父窗口变量(我是父窗口)
window.close();
}
</script>
</head>

<body>

<input type="text" name="namez" id="namez" value="namez" /><br/>
<input type="text" name="telz" id="telz" value="111111"/><a href="javascript:tianjia();"> 添加</a>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航