`

子窗体给父窗体传值 javascript opener

阅读更多

1.新建两个页面 一个是 Parent.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=utf-8" />
<title>父窗体</title>
<script language="javascript" type="text/javascript">
function OpenWindow(){
    window.open('son.html');
}
function setValue(m_strValue){
    document.getElementById("txt_Value").value = m_strValue;
}
</script>

</head>

<body>
<form id="form1" name="form1" method="post" action="">
  <label>
  <input type="text" name="txt_Value" id="txt_Value" />
  </label>
  <label>
  <input type="button" name="btn_ShowClose" id="btn_ShowClose" value="按钮" onclick="OpenWindow();" />
  </label>
</form>
</body>
</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=utf-8" />
<title>子窗体</title>
<script language="javascript" type="text/javascript" >
function CloseWind(){
    opener.setValue("传值到父窗体");
    window.close();
}
</script>

</head>

<body>
<form id="form1" name="form1" method="post" action="">
  <label>关闭
  <input type="button" name="btn_Close" id="btn_Close" value="按钮" onclick="CloseWind();"

/>
  </label>
</form>
</body>
</html>

2.通过子窗体执行的父窗体的setValue(m_strValue)来执行赋值操作.

 

==========================================================================

javascript调用父窗口(父页面)的方法。

1:   window.parent 是iframe页面调用父页面对象

举例:

a.html

程序代码
<html>
<head><title>父页面</title></head>
<body>
<form name="form1" id="form1">

<input type="text" name="username" id="username"/>

</form>
<iframe src="b.html" width=100%></iframe>
</body>
</html>


如果我们需要在b.htm中要对a.htm中的username文本框赋值,就如很多上传功能,上传功能页在Ifrmae中,上传成功后把上传后的路径放入父页面的文本框中

我们应该在b.html中写

程序代码
<script type="text/javascript">
var _parentWin = window.parent ;
_parentWin.form1.username.value = "xxxx" ;
</script>


实例地址:   http://www.cnspry.cn/blog/attachments/window.parent实例/a.html

2:   window.opener 是window.open 打开的子页面调用父页面对象

a.html

程序代码

<script type="text/javascript">
function openSubWin()
{
var _width = 300 ;
var _height = 200 ;
var _left = (screen.width - _width) / 2 ;
var _top = (screen.height - _height) / 2 ;
window.open("b.html",null,
"height=" + _height + ",width=" + _width + ",status=no,toolbar=no,menubar=no,location=no,resizable=yes,left=" + _left + ",top=" + _top);
}
</script>
<input type="text" name="username" id="username"/>
<input type="button" value="弹出子页面" onClick="openSubWin();">


b.html

程序代码

<script type="text/javascript">
function UpdateParent()
{
var _parentWin = window.opener ;
_parentWin.form1.username.value = "xxxx" ;
}
</script>
<input type="button" name="button" id="button" value="更新主页面的UserName内容" onClick="UpdateParent();"> 



实例地址:   http://www.cnspry.cn/blog/attachments/window.opener实例/a.html

 

 

=================================================================

2个方法都是刷新父窗口,但是其中还是有奥妙的哦。
      window.opener.location.reload();这个方法在强迫父窗口的时候,在有些IE浏览器(比如安全设置高)的情况下,会弹出一 个确认对话框,提示是不是要重新再刷新一次页面,这可是比较郁闷的事情哦,我后来把这个方法替换成了 window.opener.location.href=window.opener.location.href;
就不会出现那样的问题了。

 

       window.opener其实是指本窗口的父窗口,比如,one.jsp 通过popupwindow打开了two.jsp,哪么在two.jsp里面的window.opener就是指one.jsp,所以在two.jsp里 面完全可以用window.opener调用任何一个one.jsp里面的方法,实现one.jsp和two.jsp的交互。

       注意:window.opener.location.href 只是一个链接,如果想实现父窗口的提交就要调用window.opener.action="" 和window.opener.submit();方法,但是不幸的是这段代码在firefox下不能运行,解决的办法为在父窗口中写一个提交的 function在子窗口中通过window.opener.functionname()调用。

       通常在使用window.opener的时候要去判断父窗口的状态,如果父窗口被关闭或者更新,就会出错,解决办法是加上如下的验证if(window.opener && !window.opener.closed)

 

分享到:
评论
1 楼 lingxiajiudu 2013-10-06  
    不错,完美解决我了的问题,赞一个。

相关推荐

    子窗体与父窗体传值示例js代码

    代码如下: //返回值给父窗体 function returnParent(value) {//获取子窗体返回值 var parent = window.dialogArguments; //获取父页面 //parent.location.reload(); //刷新父页面 if (parent != null && parent != ...

    Javascript 两个窗体之间传值实现代码

    众所周知window.open() 函数可以用来打开一个新窗口,那么如何在子窗体中向父窗体传值呢,其实通过window.opener即可获取父窗体的引用。

    通过window.opener控制父窗体

    可以看一看啊 博文链接:https://bageer707.iteye.com/blog/74458

    window.opener用法和用途实例介绍

    window.opener,是通过window.open打开子窗体的父窗体的引用。 比如在父窗体parentForm里面,通过window.open(“subForm.html”),那么在subform.html中window.opener就代表parentForm。既然在子窗体中能够拿到父窗体...

    js关闭子窗体刷新父窗体实现方法

    代码如下: Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/–&gt;使用open方式打开的窗体 //使用地址方式 window.opener.location.href=’m_Shedule_Main.aspx’;...

    showModalDialog open弹出子窗口操作parent、opener父窗口及跨域处理

    2&gt; 父窗口与子窗口传递值的方式也有所不同,在子窗口中操作父窗口也语法也不同,分别为var parentObjs = window.dialogArguments;opener.parentObj.elementObj.arrtr = 'str'; 3&gt; IE与FireFox对两个弹出窗口在...

    opener实例页面之间传递参数

    在jsp页面通过javascript,调用opener方法在页面之间传递参数,子页面将参数返回给父页面

    javascript window.opener的用法分析

    window.opener 的用法 window.... 对于javascript中的window.opener没有很好的理解。 为什么框架中不能使用,弹出窗口的父窗口不能在框架里面的某个页面呢?那怎样通过弹出窗口操作框架中的父窗口呢? opener.parent

    parent和opener的区别

    parent和opener的区别 parent和opener的区别

    基于javascript的工作流设计器xiorkflow(含源代码)

    基于java和javascript的工作流设计器xiorkflow(含源代码)

    JS window.opener返回父页面的应用

    网上支付开发分为支付平台和客户端两部分。当客户端进入支付平台时,需要在新窗体打开支付平台页面。

    jsp 刷新父页面

    用iframe、弹出子页面刷新父页面 iframe parent.location.reload(); 弹出子页面 window.opener.location.reload(); 子窗口刷新父窗口 self.window.opener.locaction.reload(); 刷新一open()方法打开的窗口 ...

    javascript函数的解释

    45.打开子窗口的父窗口为:opener 46.表示当前所属的位置:this 47.当在超链接中调用JS函数时用:(javascript:)来开头后面加函数名 48.在老的浏览器中不执行此JS:&lt;!-- //--&gt; 49.引用一个文件式的JS:&lt;script type="text/...

    winmail opener

    不用outlook的用户,可以轻松的打开其附件,减少了不少麻烦。邮件必备

    winmail_opener邮件查看工具

    winmail_opener邮件查看工具 描述&gt;=20个字符,不支持HTML标签。 详细的资源描述有机会获得我们的推荐,更有利于他人下载,赚取更多积分。

Global site tag (gtag.js) - Google Analytics