js中实现子页面向父页面中赋值（两种方法）

wang_zhi_peng2007

于 2013-01-28 16:28:56 发布

阅读量1.6k

点赞数

CC 4.0 BY-SA版权

分类专栏： 2012-2013开发整理文章标签： javascript ViewUI

本文链接：https://blog.youkuaiyun.com/wang_zhi_peng2007/article/details/84386458

2012-2013开发整理专栏收录该内容

19 篇文章

订阅专栏

本文介绍了两种网页间数据传递的方法：一是通过JavaScript操作DOM来更新父窗口内容；二是使用showModalDialog结合returnValue属性实现模态窗口的数据返回。两种方法均涉及了父窗口与子窗口之间的交互，适用于不同场景的需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

(方法一)

父页面:
<input  id="input1" type="text"/>
<a href="javascript:window.open('test1.aspx');void(0)">弹出新的子窗口</a>

子页面:
<input id="input2" type="text" />
<input id="bt" type="button" onclick="doit();" value="更新父窗口的内容"/>
<script type="text/javascript" language="javascript">
function doit()
{
  var _value=document.getElementByIdx('input2').value;
  window.opener.document.getElementByIdx('input1').value=_value;
}
</script>

(方法二)

父页面:
<input id="input1" type="text" />
<a href="javascript:GetReturnValue();void(0)">弹出新的模态子窗口</a>
<script type="text/javascript" language="javascript">
 function GetReturnValue()
 {
     var temp= window.showModalDialog("test1.aspx","","center=yes;help=no;status=no");
     document.getElementByIdx('input1').value = temp;
 }
</script>

子页面:
<input id="input2" type="text" />
<input id="bt" type="button" onclick="doit();"  value="更新父窗口的内容"/>
<script type="text/javascript" language="javascript">
function doit()
{
  var _value=document.getElementByIdx('input2').value;
  window.returnValue =_value;
  window.close();
}
</script>