`

iframe相关页面的调用

阅读更多
参考链接:
1 iframe里面的页面调用父窗口,左右窗口js函数的方法
  http://nyazheng.blog.163.com/blog/static/57126465200942293956884/

2 父窗口调用iframe子窗口方法
  通常方式:
<iframe name="myFrame" id="myFrame" src="child.html"></iframe>

  A方式: 
myFrame.window.functionName()
;
  B方式:
document.getElementById('myFrame').contentWindow.functionName()
;//推荐这种方式.

3 iframe子窗口调用父窗口方法
A 调用父窗口的方法:    
parent.functionName()
;
B 设置父窗口的值   :   
parent.formId.value='test
';

4 调用子iframe中相关方法
如下:
<frameset id="A" name="A" rows="36,*" border="0" frameborder="0" >
   <frame id="B" src="" noresize scrolling="no"/>
   <frameset id="C" cols="0,*">
	   <frame id="C1" src="" noresize scrolling="no"/>
	   <frame id="C2" noresize scrolling="no"/>
  </frameset>

获取A中iframe并调用
var fs = window.frames["P_A"].window.frames["A"].document.getElementsByTagName("frame");
var leng = fs.length;   
var fid = 'test1';
  for(var i=1;i<fs.length;i++){
       if(fid == fs[i].id){
         alert("存在调用的iframeID");
       }
} 
  
假设是从父窗口调用.
var PA= window.frames["P_A"];       
PA.frames["A"].document.getElementById(fid).contentWindow.functionName();

分享到:
评论

相关推荐

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

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

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

    总结,`iframe`中的JavaScript交互涉及到页面间的通信,无论是父页面调用子页面还是子页面调用父页面,都需要理解`window`对象、同源策略以及跨域通信机制。正确使用这些技术,可以在多页面应用中实现更复杂的功能...

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

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

    iframe兄弟页面相互调用

    本文将详细讲解如何实现`iframe`兄弟页面之间的相互调用。 首先,理解`iframe`的结构是关键。一个`iframe`元素在HTML中通过`&lt;iframe src="..." &gt;&lt;/iframe&gt;`定义,`src`属性指定了要加载的页面URL。多个`iframe`在...

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

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

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

    本文将通过一个具体的示例介绍如何实现iframe中的父页面与子页面之间的互相调用,以及子页面中再嵌套iframe时的相关操作。 #### 1. 基本概念 首先我们需要了解几个基本的概念: - **父页面(Parent Frame)**:指...

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

    利用这个对象,我们就可以访问到iframe页面中的全局变量和函数。 在使用jQuery进行操作时,需要注意的是jQuery本身并不提供跨iframe域的直接支持。因此,这里提到的方法和实例都基于同源策略,即父页面和iframe页面...

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

    // 然后,可以调用iframe页面中的函数 frames.right(); ``` 这里的`window.parent.window`用于返回到包含`iframe`的上一级窗口,然后通过`getElementById`找到`iframe`元素,进一步获取它的`contentWindow`属性,这...

    iframe弹出框遮罩父类页面

    6. **易于使用**:由于描述中提到,所有代码都在子页面内部,这意味着用户只需要在子页面中引入必要的JavaScript和CSS,然后调用相关的函数即可,无需修改父页面的代码,提高了代码的可维护性和复用性。 在提供的`...

    js调用iframe实现打印页面内容的方法

    本知识点主要介绍如何使用JS调用iframe元素来实现页面内容的打印功能。 ### 知识点一:使用iframe实现区域打印 通过创建一个iframe元素,并将其添加到文档中,可以实现在一个隔离的环境中进行打印,这样做的好处是...

    iframe跨域互相调用资源

    本示例“iframe跨域互相调用资源”提供了一个解决方案,它着重展示了如何通过`iframe`实现在不同源之间进行通信,并且处理了浏览器兼容性问题,特别是对较老版本的IE浏览器(至少支持到IE8)的支持。 首先,`iframe...

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

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

    js实现iframe跨页面调用函数的方法

    在JavaScript中,实现iframe跨页面调用函数是一个常见的需求,特别是在构建复杂的Web应用程序时。当一个页面(父页面)嵌入了另一个页面(子页面)作为iframe时,有时需要在两个页面之间通信,调用各自的功能。下面...

    js中iframe调用父页面的方法

    子页面调用父页面的方法在js中很容易实现。我们只需要在主页面加个函数,然后在子页面通过window.parent.方法()即可实现了 比如调用a()函数,就写成: 代码如下:window.parent.a(); 但是我在chrome浏览器下却发现此...

    同级iframe间的函数调用

    标题“同级iframe间的函数调用”涉及的是如何在不同`iframe`之间共享数据和交互,这是跨域安全策略下实现页面间通信的一种方式。 在同一个域名下,`iframe`可以相互访问,这是因为它们被视为同一源(same-origin ...

    js-iframe-传值调用实例代码

    这个实例代码“js-iframe-传值调用”旨在演示如何通过JavaScript在父窗口和iframe之间传递数据,实现页面间的交互。我们将详细探讨这个过程中的关键知识点。 首先,我们要理解iframe的基本结构。一个iframe标签通常...

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

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

Global site tag (gtag.js) - Google Analytics