`

使用JS调用iframe页面中的函数

阅读更多

用JS调用iframe、frame页面中的函数其实不难,要是页面简单的话就更容易了。今天弄得这个项目比较复杂,调起函数来比较费劲,所以就记一下,以后好借鉴。

 

先说说页面结构的复杂性:

首页index.jsp用frameset嵌了三个frame,id和name分别是:topFrame,mainFrame,bottomFrame

mainFrame对应的JSP页面又由2个iframe组成,id和name分别是:left和right

right iframe对应的JSP页面包含了多个iframe。

需要调用的方法在最下层也就是right iframe下面的iframe中。

 

IE中调用起来挺简单的,如下即可:

var obj = document.right;
if(isempty(obj)){
	obj = window.parent.frames["mainFrame"].document.right;
}
obj.excuteOpenPage();

 但是在火狐中上面写的两种方法都不管事,于是去网上搜罗了一下,找到了一个IE火狐到能使的(链接:http://www.cnblogs.com/yeminglong/archive/2013/03/21/2974095.html),应用到项目中就是:

window.parent.document.getElementsByTagName("frame")["mainFrame"].contentWindow.
document.getElementsByTagName("iframe")["right"].contentWindow.
excuteOpenPage();

 

 

分享到:
评论

相关推荐

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

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

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

    在 iframe 子页面中调用父页面的 js 函数非常简单,只需要使用 `window.parent` 对象。例如,要调用父页面的 `a()` 函数,只需要写成: ``` window.parent.a(); ``` 如果要在 iframe 子页面中取父页面中的标签中的值...

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

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

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

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

    javscript调用iframe框架页面中函数的方法_.docx

    JavaScript调用IFrame框架页面中函数的方法是一种常见的前端交互技术,尤其在构建复杂网页应用时,IFrame常用于模块化加载和隔离不同部分的代码。本文将深入探讨如何在JavaScript中实现这一功能,并提供相关示例。 ...

    Javscript调用iframe框架页面中函数的方法__1.docx

    在JavaScript中,调用iframe框架页面中的函数是跨文档通信的一种常见方式,特别是在网页嵌套或者需要在不同页面间共享数据和功能时。本篇将详细介绍如何实现这一操作,并给出具体的示例代码。 首先,我们需要了解...

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

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

    同级iframe间的函数调用

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

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

    例如,如果父页面定义了一个名为"getHelloWorld"的函数和一个名为"hello"的变量,那么在iframe中可以通过以下方式调用: ```javascript parent.getHelloWorld(); // 调用父页面的方法 alert(parent.hello); // 弹出...

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

    在`iframe`子页面中,要调用父页面的JavaScript函数,可以使用`window.parent`对象来引用父窗口。假设父页面有一个名为`a()`的函数,子页面可以这样调用它: ```javascript window.parent.a(); ``` 如果需要获取父...

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

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

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

    jquery、js调用iframe父窗口与子窗口元素的方法整理 在Web开发中,iframe是一个常用的技术,用于在...jquery和js调用iframe父窗口与子窗口元素的方法是Web开发中的一个重要技术,可以帮助开发者更好地实现自己的项目。

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

    在`iframe`中的页面,可以通过`window.parent`属性来访问父页面的全局对象,从而调用父页面中定义的函数。例如,如果父页面有一个名为`a`的函数,`iframe`中的代码可以这样调用它: ```javascript window.parent...

    父窗口调用iframe子窗口方法

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

    javascript iframe内的函数调用实现方法

    在开发中,经常需要在主页面和iframe页面之间进行交互,比如主页面需要调用iframe页面中的JavaScript函数。但是这种跨文档的调用可能会涉及到浏览器的安全策略,特别是同源策略。同源策略会限制一个源(origin)上的...

    js处理iframe的系列问题

    // 调用iframe中的方法 window.parent.frames["ifrMapCompanyDetails"].XXX(); // 或者通过索引方式调用 window.parent.frames[0].XXX(); ``` #### 6. 调用子页面中的事件 当需要触发`iframe`内部的某个事件时,...

    js调用浏览器打印模块实现点击按钮触发自定义函数

    在探讨如何利用JavaScript调用浏览器的打印模块实现点击按钮时触发自定义函数的过程中,我们首先需要了解浏览器提供的打印API以及如何通过编程方式触发打印任务。现代浏览器通常提供了window.print()方法,该方法...

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

    在IT行业中,前端开发经常会遇到页面间的交互问题,如数据传递和函数调用。EasyUI是一个基于jQuery的UI框架,提供了丰富的组件,其中包括用于创建弹出窗口(window)的功能。在EasyUI中,我们可能会遇到需要在弹出...

Global site tag (gtag.js) - Google Analytics