`

js里父页面与子页面的相互调用

 
阅读更多

一、在页面里用 open 打开的子页面:

1、子页面调用父页面的方法,包括子页面给父页面传值:  

   window.opener.methodName();

   window.opener.methodName(param1,param2);

2、父页面关闭子页面:在父页面 

   openWin=window.open("");

   function bClick(){

        openWin.close();

   }

 

二、在Iframe 的子页面里

   子页面给父页面的Div赋值

   parent.window.document.getElementByIdx_x('id').innerHTML='';

   调用父页面的方法

   window.parent.window.methodName();

   刷新父页面

   window.parent.location.reload();

 

 

open  打开的属性

 

window.open(pageURL,name,parameters)
其中:
pageURL 为子窗口路径
name 为子窗口句柄
parameters 为窗口参数(各参数用逗号分隔)

参数 | 取值范围 | 说明

alwaysLowered | yes/no | 指定窗口隐藏在所有窗口之后
alwaysRaised | yes/no | 指定窗口悬浮在所有窗口之上
depended | yes/no | 是否和父窗口同时关闭
directories | yes/no | Nav2和3的目录栏是否可见
height | pixel value | 窗口高度
hotkeys | yes/no | 在没菜单栏的窗口中设安全退出热键
innerHeight | pixel value | 窗口中文档的像素高度
innerWidth | pixel value | 窗口中文档的像素宽度
location | yes/no | 位置栏是否可见
menubar | yes/no | 菜单栏是否可见
outerHeight | pixel value | 设定窗口(包括装饰边框)的像素高度
outerWidth | pixel value | 设定窗口(包括装饰边框)的像素宽度
resizable | yes/no | 窗口大小是否可调整
screenX | pixel value | 窗口距屏幕左边界的像素长度
screenY | pixel value | 窗口距屏幕上边界的像素长度
scrollbars | yes/no | 窗口是否可有滚动栏
titlebar | yes/no | 窗口题目栏是否可见
toolbar | yes/no | 窗口工具栏是否可见
Width | pixel value | 窗口的像素宽度
z-look | yes/no | 窗口被激活后是否浮在其它窗口之上

分享到:
评论

相关推荐

    iframe父页面与子页面通信及相互调用方法

    "iframe父页面与子页面通信及相互调用方法"是一个重要的主题,涉及到跨域安全、DOM操作以及JavaScript/jQuery的交互技术。下面将详细解释这一知识点。 1. **基本概念** - **父页面(Parent Page)**:包含`iframe`...

    浅谈js中子页面父页面方法 变量相互调用

    (1)子页面调用父页面的方法或者变量: window.parent.方法()或者变量名 window.parent相当于定位到父页面 之后的操作和在父页面中写代码一样写 window.parent.aa();//调取aa函数 window.parent.bb;//调取bb变量 ...

    子页面和父页面的相互调用

    本文将深入探讨这个主题,介绍如何在HTML中实现子页面与父页面的互相调用,并通过示例代码`parent.html`和`childPage.html`来帮助理解。 首先,我们要明白在浏览器环境中,每个HTML页面都是一个独立的上下文,它们...

    iframe父页面与子页面互相调用

    ### Iframe父页面与子页面互相调用 在Web开发中,经常需要用到iframe来嵌套显示其他页面。本文将通过一个具体的示例介绍如何实现iframe中的父页面与子页面之间的互相调用,以及子页面中再嵌套iframe时的相关操作。 ...

    js中子页面获取父页面ID

    - **父页面与子页面**:通常情况下,子页面是指通过`<iframe>`标签嵌入到父页面中的另一个独立页面。 - **DOM(Document Object Model)**:文档对象模型是HTML或XML文档的规范化的表示形式,允许编程和运行脚本语言...

    (js)父子页面相互调用总结(js)父子页面相互调用总结

    ### (JS)父子页面相互调用总结 在前端开发中,常常会遇到需要在不同的页面之间进行数据交换或状态同步的情况。特别是在涉及到`iframe`或`window.open`打开的新窗口时,这种需求更为常见。本文将详细介绍如何在父...

    JS父页面与子页面相互传值方法

    在多页面应用或者嵌入式框架(如iframe)中,经常需要进行父页面与子页面之间的数据交换。下面将详细介绍如何在不同场景下使用JS实现这种传值。 一、子页面是父页面通过`window.open`弹出的情况 当子页面是通过`...

    frame之间以及子页面和父页面间参数传递

    在提供的示例代码中,父页面和子页面分别使用了简单的JavaScript函数实现了相互之间的元素访问。这种直接访问DOM元素的方法简单直接,适合在同源策略允许的情况下使用。 - **父页面**: ```html 获取子页面文本" ...

    用js互相调用iframe页面内的js函数

    在这个场景下,涉及到的一个常见需求就是如何用JavaScript在主页面与`iframe`页面之间互相调用函数,以便于进行更复杂的交互。 标题提到的问题是在各种浏览器中,尤其是考虑到跨浏览器兼容性时,如何用JS实现主页面...

    iframe父与子、子与子之间控制以及js相互调用实际例

    **iframe的父子、子与子之间的交互** 在Web开发中,有时我们需要在iframe中嵌入的页面与主页面,或者两个嵌套的iframe之间进行数据交换和功能交互。这可以通过JavaScript来实现,主要涉及以下几个方面: 1. **父...

    js与aspx相互调用

    js与aspx相互调用js与aspx相互调用js与aspx相互调用js与aspx相互调用

    layer弹出层父子页面事件相互调用方法

    为了实现数据的传递,可以通过在父页面中设置iframe的src属性,并在子页面中使用JavaScript获取父页面传递的参数,同时也可以在子页面中操作父页面的DOM元素或调用父页面的方法。 在上述提供的代码片段中,父页面...

    js父页面中使用子页面的方法

    父页面和子页面通过iframe元素相互调用JavaScript函数是一个常见的Web开发场景,这涉及到跨文档消息传递(Cross-document messaging),通常称为“postMessage API”。通过这种方法,两个不同源的文档可以安全地进行...

    关于Iframe父页面与子页面之间的相互调用

    本文将详细探讨如何实现Iframe父页面与子页面之间的相互调用。 首先,理解window对象是关键。在浏览器中,每一个HTML文档都有一个与之关联的window对象,它是全局JavaScript对象,包含了浏览器窗口的所有功能。在...

    子页面访问父页面和跨iframe访问(ie 和火狐)

    在网页开发中,有时我们需要在不同的页面或者框架之间进行交互,比如子页面操作父页面的数据,或者在一个iframe中访问另一个iframe中的内容。这种情况在实际应用中很常见,尤其是在构建复杂Web应用时。以下是对"子...

    iframe与父页面传值(方法互调)

    本篇文章将深入探讨如何在`iframe`与父页面之间进行值的传递以及方法的互相调用。 首先,我们可以通过JavaScript的DOM(Document Object Model)接口来实现`iframe`与父页面之间的通信。在`iframe`内的页面,我们...

    父子页面数据相互传递

    例如,父页面可以访问`iframe.contentWindow`对象与子页面进行交互。 5. 自定义事件:通过监听和触发自定义事件,可以实现在不同页面间的数据传递。父页面可以监听一个特定事件,子页面在需要的时候触发这个事件,...

    ActionScript与JavaScript相互调用

    ### ActionScript与JavaScript相互调用 #### 概述 随着互联网技术的发展,网页设计与开发逐渐成为一门重要的技能。在这一领域中,多种脚本语言和技术被广泛应用,以实现更加丰富的用户体验。其中,ActionScript与...

    vbscript和javascript互相调用方法

    在IT领域,特别是Web开发中,VBScrip与JavaScript互相调用是实现动态网页功能的重要技术之一。本文将深入探讨VBScript和JavaScript互相调用的方法,以及它们在ASP环境中的应用,帮助读者理解这两种脚本语言如何协同...

Global site tag (gtag.js) - Google Analytics