`

iframe调用子iframe的方法,子调用父iframe的方法

    博客分类:
  • js
阅读更多

在index.html页面中有

 <script type="text/javascript">
  function test(){
   alert('test() success!');
  }
 </script>

<body>
    <a href="#" onclick="frame1.window.childFunction();">调用</a>
      <iframe name="frame1"   src="test1.html"/>
      <iframe name="frame2"   src="test2.html"/>
  </body>

在test1.html页面中有

<script type="text/javascript">
  function childFunction(){
   alert('test childFunction() success!');
  }
 </script>

<body>

<a href="#" onclick="parent.test();">调用</a>

</body>

iframe调用子iframe的方法:parent.test()

子调用父iframe的方法:frame1.window.childFunction()

分享到:
评论

相关推荐

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

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

    在iframe中调用js父页面和子页面方法

    本篇文章将深入探讨如何在`iframe`中调用JavaScript,实现父页面与子页面之间的方法交互。 一、iframe的基本使用 在HTML中,我们可以通过`&lt;iframe&gt;`标签来插入一个框架,例如: ```html &lt;iframe src="child....

    父窗口调用iframe子窗口方法

    在Web开发中,"父窗口调用iframe子窗口方法"是一个常见的交互场景,尤其是在构建复杂的单页面应用或者需要跨窗口通信时。这篇文章将详细讲解如何实现这个功能,并提供相关的源码示例。 首先,理解基本概念。`iframe...

    JavaScript实现IFrame子窗口调用父窗口的全局变量

    JavaScript实现IFrame子窗口调用父窗口的全局变量

    iframe子父页面调用js函数示例.docx

    "iframe子父页面调用js函数示例" 在实际项目中,iframe 子父页面调用 js 函数是非常有用的。下面是一个示例,演示如何在 iframe 子页面中调用父页面的 js 函数,以及如何在父页面中调用 iframe 子页面的 js 函数。 ...

    Jquery调用iframe父页面中的元素及方法

    不过,当iframe和父页面属于同一域时,可以通过JavaScript或jQuery来操作父页面中的元素和方法。本文将详细介绍如何使用jQuery来查找和操作iframe父页面中的元素和方法。 首先,需要明确iframe元素可以被视为一个...

    iframe 父窗口和子窗口相互的调用方法集锦

    一、父窗口调用iframe子窗口方法 1、HTML语法:&lt;iframe name=”myFrame” src=”child.html”&gt;&lt;/iframe&gt; 2、父窗口调用子窗口:myFrame.window.functionName(); 3、子窗品调用父窗口:parent....

    js中iframe调用父页面的方法

    本文实例讲述了js中iframe调用父页面的方法。分享给大家供大家参考。具体实现方法如下: 子页面调用父页面的方法在js中很容易实现。我们只需要在主页面加个函数,然后在子页面通过window.parent.方法()即可实现了 ...

    easyUi弹出window窗口传值与调用父页面的方法,子页面给父页面赋值

    在EasyUI中,我们可能会遇到需要在弹出窗口(子页面)与父页面之间进行数据传递或调用父页面方法的需求。下面将详细讲解这个过程。 首先,让我们理解标题中的“弹出window窗口传值”。在EasyUI中,创建一个弹出窗口...

    jquery、js调用iframe父窗口与子窗口元素的方法整理.docx

    jquery、js调用iframe父窗口与子窗口元素的方法整理 在Web开发中,iframe是一个常用的技术,用于在一个HTML文档中嵌入另一个HTML文档。然而,在使用iframe时,经常会遇到一个问题:如何在iframe中访问父窗口的元素...

    iframe子父页面调用js函数示例

    本篇文章将详细讲解如何在`iframe`子页面调用父页面的JS函数以及反之的操作。 ### 1. 子页面调用父页面的JS函数 在`iframe`子页面中,要调用父页面的JavaScript函数,可以使用`window.parent`对象来引用父窗口。...

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

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

    js中iframe调用父页面的方法.docx

    下面我们将详细介绍`js`中`iframe`调用父页面方法的相关知识点。 1. **基本调用方式** 在`iframe`中的页面,可以通过`window.parent`属性来访问父页面的全局对象,从而调用父页面中定义的函数。例如,如果父页面有...

    web前端iframe相互调用方法详解

    - 如果存在多层嵌套的iframe,即子页面想要调用更高层级的父页面中的方法,可以使用多个parent对象进行链式调用。例如,如果childPage1.html又嵌入了grandchildrenPage.html,那么grandchildrenPage.html可以使用`...

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

    然而,当涉及到`iframe`与父页面之间的通信时,就需要用到一些特殊的方法来实现数据的传递和函数调用。本篇文章将深入探讨如何在`iframe`与父页面之间进行值的传递以及方法的互相调用。 首先,我们可以通过...

    iframe跨域调用父窗口js.zip

    但是,通过特定的技术手段,我们可以实现iframe跨域调用父窗口的JavaScript方法。本教程将详细讲解这一过程。 首先,我们需要了解同源策略。同源策略是浏览器为了保护用户安全而实施的一项机制,它规定只有当两个...

    jquery、js调用iframe父窗口与子窗口元素的方法整理

    以上就是jQuery和JavaScript调用iframe父窗口与子窗口元素的方法。在实际应用中,要注意跨域问题,如果父页面和iframe的源不同,它们之间的交互可能会受到浏览器同源策略的限制。此外,确保正确引用jQuery库,并且在...

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

    - `contentWindow` 属性:通过`iframe`元素的`contentWindow`属性,我们可以获取到iframe内部的`window`对象,从而调用其上的方法或修改DOM。 - `window.postMessage()` 方法:这是一个安全的跨域通信方式,允许两...

    frameset父页面和子页面的方法之间调用个属性的调用(页面上可以包含iframe)

    在标题和描述中提到的"frameset父页面和子页面的方法之间调用个属性的调用",涉及到的是跨框架通信的概念。当一个`frameset`中有多个`frame`或`iframe`时,它们之间可能需要进行数据交换或操作交互。这种交互可以...

Global site tag (gtag.js) - Google Analytics