JS实现父页面和子页面相互传值_网络编程_奇迪科技(深圳)有限公司(www.qvdv.net)

制作个网站页面，想实现点击弹出一个页面，把父页面的值传递到子页面，在子页面处理完后，关闭子页面，把值再传回父页面，而不刷新父页面，通过JS实现，以下是JS实现的代码展示：

一、父页面/父窗口

<input type="text" id="oldPath" name="picPath" value="$info"> 
<a href="javascript:;" onclick="openWin('../upFile');">传值到子页面</a>
<script>
    function openWin(str) {
        document.getElementById("oldPath").value = document.getElementById("oldPath").value;   
        window.open(str, null,'width=550,height=500'); // 打开窗口
    } 
</script>

二、子页面/子窗口:

<div class="content">
<script language="javascript">   
//获取父窗口的值
var prtW = window.opener;
var prtA;
if(prtW!=null){
    prtA = prtW.document.getElementById("oldPath").value;
    document.getElementById("oldUrl").value=prtA;
}
//传值到父窗口
function getValue() {
window.opener.document.getElementById('oldPath').value = document.getElementById('picPath').value // 赋值
window.opener.document.getElementById('pic').src = document.getElementById('picPath').value // 赋值
window.close(); // 关闭窗口
}
</script>
    <input type="text" id="picPath" value="$info">
    <a href="#" onclick="getValue()" >传值到父页面</a>
</div>

以上代码经过测试，能实现预想的功能。