主要实现父子关系的页面
window.opener 是window.open 打开的子页面调用父页面对象
a.html
<html>
<head>
<title>主页面</title>
<script type="text/javascript">
/** 为测试IFrame子窗口调用父窗口的全局变量而添加的测试变量 */
var parentVairous = "为测试IFrame子窗口调用父窗口的全局变量而添加的测试变量";
/**
* 因为不同于IFrame（IFrame有id,window.open()与IFrame的父子窗口的模式不同）,
* 所以当是通过window.open()方法打开一个新窗口使, 必须有一个新窗口的对象
* 当然必须先让子窗口弹出来, 才能调用子窗口中的变量, 否则抛出异常
*/
var OpenWindow;
function openSubWin()
{
OpenWindow = window.open('b.html', 'newwindow', 'height=1024, width=1300, top=0, left=0, toolbar=no, menubar=yes, scrollbars=yes,resizable=yes,location=no, status=no');
}
function parentInvokeChild()
{
if(OpenWindow)//当然必须先让子窗口弹出来, 才能调用子窗口中的变量, 否则抛出异常
{
alert(OpenWindow.iFrameVair);
}
}
</script>
</head>
<body>
<form name="form1" id="form1">
<input type="text" name="username" id="username"/>
<input type="button" value="弹出子页面" onclick = "openSubWin()">
<input type="button" value="测试调用弹出窗口中的全局变量" onclick = "parentInvokeChild()">
</form>
</body>
</html>
b.html
<html>
<head>
<title>子页面</title>
<script type="text/javascript">
/** 为测试父窗体调用IFrame子窗体的全局函数而添加的子窗口全局函数 */
var iFrameVair = "测试父窗体调用IFrame子窗体的全局函数";
function UpdateParent()
{
var _parentWin = window.opener;
_parentWin.form1.username.value = "xxxx" ;
}
function childInvokeParent()
{
var parentVairous = window.opener.window.parentVairous;
alert(parentVairous);
}
</script>
</head>
<body>
<form name="form1" id="form1">
<p> </p>
<p align="center">
<input type="button"
onclick = "UpdateParent();"
name="button"
id="button"
value="更新主页面的UserName内容">
<input type = "button"
name = "button2"
id = "button2"
value = "测试IFrame子窗口调用父窗口的全局变量"
onclick = "childInvokeParent();"/>
</p>
<p> </p>
</form>
</body>
分享到：
相关推荐
在JavaScript中，`window.open`方法是一个非常实用的功能，它允许开发者创建新的浏览器窗口或标签页，并在其中加载指定的网页内容。这个方法在交互式用户界面设计中尤其常见，例如用于显示警告、确认对话框或者...
本文将详细介绍如何使用JavaScript实现父窗口与子窗口之间的调用以及值的传递。 #### 一、基本概念 1. **父窗口**：通常指打开新窗口的原始页面。 2. **子窗口**：由父窗口通过`window.open()`方法打开的新窗口。 ...
在JavaScript编程中，父窗口与子窗口之间的通信是一种常见的需求，特别是在构建多窗口应用程序或弹出窗口时。本文将深入探讨如何在JavaScript中实现父窗口与子窗口之间的数据传递。 首先，我们需要理解“父窗口”和...
var txt = window.opener.document.getElementById("msg"); txt.value = "secondsaysyouwelcome"; }); } function secondcall(msg) { if (msg.indexOf("third") > 0) { tw = window.open("third.html", ...
2. 访问或修改父窗口的元素：通过`window.opener.document.getElementById`或`window.opener.document.querySelector`等方法，我们可以找到并操作父窗口中的HTML元素。例如，`window.opener.document.getElementById...
在Web开发中，有时我们需要在弹出的子窗口与打开它的父窗口之间进行通信。"通过window.opener控制父窗体"这个主题就是关于如何在JavaScript中实现这种跨窗口交互的技术。下面将详细阐述这个知识点。 一、window....
例如，通过`window.opener`对象，子窗口可以访问到打开它的父窗口，而`iframe`内的脚本可以通过`parent`对象与父页面通信。 - 父窗口调用子窗口： ```javascript let newWindow = window.open('...'); newWindow....
下面详细介绍如何使用 `window.open()` 来实现父窗口与子窗口的数据传递。 ##### 1. 打开新窗口并传递数据 ```javascript function outPut() { // 获取当前输入框中的值 var text = document.abc.text.value; ...
在JavaScript中，有时我们需要从一个子窗口（通常是通过`window.open()`方法打开的新窗口）与父窗口（即打开该新窗口的原始窗口）之间进行交互。这种交互可能包括调用父窗口中的函数或修改父窗口中元素的状态等。...
例如，如果我们在子窗口中有一个变量`value`要传递，可以使用`window.opener.value = '新值'`来设置父窗口中的`value`。 - 父窗口中，打开子窗口时保存一个引用，如`var childWindow = window.open(...)` - 然后在...
通过在子窗口中调用`window.opener.location.reload()`，可以实现在子窗口关闭时刷新父窗口。具体实现如下： ```javascript // 子窗口代码 window.close(); if (条件满足) { window.opener.location.reload(); } `...
在Web开发中，`window.open()`方法用于创建一个新的浏览器窗口或标签页，并返回对新打开窗口的引用。这个方法在很多场景下非常有用，比如用来实现弹出窗口、跳转链接等功能。然而，由于浏览器的安全策略和用户体验...
总结一下，子窗口向父窗口传递值主要依赖于`window.parent`和`window.opener`这两个属性，它们允许子窗口访问并操作父窗口的DOM元素。通过结合查询字符串传递初始数据和JavaScript操作，可以实现复杂的跨窗口通信。...
在JavaScript中，`showModalDialog`是一个非常有用的函数，它允许我们打开一个新的浏览器窗口或对话框，并与父窗口进行交互。这个功能在开发过程中经常用于创建弹出式表单、确认对话框或者需要用户输入信息的场景。...
在用户通过一个链接或脚本打开新窗口后，新窗口可以通过 `window.opener` 访问到打开它的父窗口。而 `window.close()` 方法则用于关闭当前窗口。 在IE6中，使用 `window.opener = null; window.close();` 的组合，...
3. **刷新父窗口**：如果存在父窗口，则调用`win.opener.location.reload()`来刷新父窗口。这里还提供了一个备选方案`parent.location.reload()`，同样可以达到刷新父窗口的目的。 4. **异常处理**：使用`try......
这涉及到的主要技术包括使用`window.open()`方法、`window.showModalDialog()`方法以及如何在父窗口与子窗口之间进行数据交互。 ### JavaScript 打开静态子窗口 #### 1. 理解静态子窗口的概念 在Web开发中，子窗口...
这使得子窗口可以与父窗口进行交互，例如修改父窗口的 DOM 元素、调用父窗口的函数或者关闭父窗口。 #### 示例：组织信息选择 在上述实例中，有一个添加人员信息的父窗口，其中包含一个用于选择机构的按钮。点击...
5. **父窗口与子窗口的通信**：在JavaScript中，`window.open()`方法用于打开新的浏览器窗口，创建一个子窗口。一旦子窗口被创建，可以通过`window`对象的属性（如`opener`）与父窗口进行通信。例如，子窗口可以修改...
在Web开发中，子窗口与父窗口间的互相调用是一个常见的需求，尤其是在涉及iframe或者通过JavaScript弹出新窗口的场景。本文深入探讨了JavaScript中如何实现子窗口与父窗口间的数据交互、窗口控制等操作。 首先，想...