子页面与父页面的打开及传参方式

最新推荐文章于 2024-09-29 14:58:50 发布

转载最新推荐文章于 2024-09-29 14:58:50 发布 · 150 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/hansha-12/archive/2012/06/08/2542009.html

本文介绍了一种在父页面和子页面之间双向传递参数的方法。通过JavaScript操作，实现了从父页面向子页面传递数据，并能将子页面的数据带回父页面。具体实现包括使用window.opener获取父窗口对象及利用表单元素交换数据。

test22.html (即子页面)

<html>

<head>

//传递参数都是在子页面中进行传递的
<script>

//将父页面中的某个值带到子页面中
function testOpen(){
alert('e');
// window.opener代表父页面，可以通过表单元素取到父页面中的某个值
var parentTest1 = window.opener.document.testForm.text1.value;
alert(parentTest1);
//将父页面中获取的某个值赋给子页面。若是一开始就开始展现，在body里面onload即可。
document.getElementById('test21').value=parentTest1;
}

//将子页面中的某个值赋给父页面。并且父页面已经有这个表单元素,例如 <input type="hidden" name="text3" value=""/>
function guanbi(){
//获取子页面要传递的参数
var child=document.test2Form.text23.value;
window.opener.document.testForm.text3.value=child;
opener=null;
self.close();
}

</script>
</head>

</html>

<hr>

testParent.html （即父页面）

<html>

function openWindowTest(){
window.open('test22.html','newwindow','height=100,width=400');
}

</script>
</head>

</html>

转载于:https://www.cnblogs.com/hansha-12/archive/2012/06/08/2542009.html