`
阅读更多

子窗口访问父页面iframe中的iframe

子窗口访问最顶层页面中的iframe中的iframe

top打开的子窗口访问父页面中的iframe中的iframe

top打开的子窗口访问最顶层页面中的iframe中的iframe

========================

蕃薯耀 2018年2月5日

http://fanshuyao.iteye.com/

 

页面情况说明:

 

页面使用jquery eayui架构,主页是一个普通页面(main页面),然后打开一个tab标签页面(first_iframe页面),tab标签页面中有一个iframe页面(second_iframe页面)。

在second_iframe页面打开一个选择的子窗口(使用top.$("#xxx_id").window("open")打开一个iframe窗口),那么当在子窗口选择完数据后,如何将数据返回到原来的打开窗口中呢?

 

如果不使用top,则直接使用window.parent应该就可以调用父页面的方法。

由于使用的是top.$("#xxx_id")打开的,已经进入到最外层的页面窗口,需要回去原来的second_iframe页面,则需要一层一层进去,方法如下:

 

//获取第一层iframe对象
var first_iframe = $(window.parent.document).find("#firstIframeId");

//获取第二层iframe(第一层iframe中的又一个iframe)
var second_iframe = $(first_iframe).contents().find("#secondIframeId");

//在第二层iframe中,调用iframe中的方法,方法可带参数param或者不带参数。
//$(second_iframe)[0]后面为什么会有一个[0]呢,我暂时不清楚,但这样是对的。去掉[0]会提示出错。
//callSecondIframeMethod为second_iframe页面中的方法名
$(second_iframe)[0].contentWindow.callSecondIframeMethod(param);
//在第二层iframe中,给iframe中的元素赋值。
$(second_iframe).contents().find("#secondIframeElementId").val(elementValue);

 

 

 

========================

蕃薯耀 2018年2月5日

http://fanshuyao.iteye.com/

 

 

 

1
0
分享到:
评论
2 楼 masuweng 2018-02-11  
       
1 楼 蕃薯耀 2018-02-05  
子窗口访问父页面iframe中的iframe
子窗口访问最顶层页面中的iframe中的iframe
top打开的子窗口访问父页面中的iframe中的iframe
top打开的子窗口访问最顶层页面中的iframe中的iframe

================
蕃薯耀

相关推荐

    iframe弹出框遮罩父类页面

    在网页开发中,有时我们需要实现一个功能,即在iframe中打开一个新的弹出窗口,并且这个弹出窗口能够遮罩住其父级页面,提供一种更好的用户体验。标题"iframe弹出框遮罩父类页面"正是关于这个技术点的讨论。在描述中...

    拖拽一个iframe中的div 在另一个iframe页面中显示

    这可能需要通过`window.parent`或者`window.top`来访问父窗口或顶层窗口的DOM。 5. **绑定事件**:确保在目标iframe中的div也具有拖放功能,或者根据需求添加其他交互事件。 6. **安全性和兼容性**:考虑到浏览器...

    js实现ifram取父窗口URL地址的方法

    本文介绍的JavaScript方法,就是如何在iframe中实现获取父窗口URL地址的过程。这一过程利用了JavaScript中的window.parent对象,它是iframe元素与父窗口之间的桥梁。 首先,理解window对象在JavaScript中的地位非常...

    JS刷新父页面 父窗口

    - **数据更新后的页面刷新**:当子窗口完成了一些数据操作,如删除、添加等操作后,需要立即反映在父窗口中。 #### 扩展知识点 1. **`window.opener`与`window.parent`的区别**: - `window.opener`:指的是打开...

    HTML iframe子窗口与主容器间互相操作,互相访问,传递数据

    - 子窗口访问主窗口:在子窗口的JavaScript代码中,`parent`对象代表了包含它的顶层窗口。例如,`parent.document`可以访问父窗口的DOM。 3. **互相操作DOM** - 从主容器操作子窗口的DOM:获取子窗口的文档对象,...

    关于iframe页面报错如何跳到框架显示

    - `self`对象代表当前窗口,而`top`对象则代表顶层窗口(即没有父窗口的窗口)。 - 如果当前窗口不是顶层窗口,那么使用`top.location.href = self.location.href;`将顶层窗口的URL设置为当前窗口的URL,从而实现了...

    多个iframe,其中一个的div能够处于最上层显示

    在网页设计中,`iframe` 是一种非常有用的元素,它允许我们在一个页面中嵌入另一个网页。当有多个 `iframe` 并存时,可能会出现重叠或者层级问题,特别是当其中某个 `iframe` 中有一个需要突出显示的 `div` 元素时。...

    iframe页跳转父窗体

    #### 二、为什么需要让iframe页面跳转到父窗口? 在实际开发过程中,有时候我们需要在`iframe`内部进行操作来影响其外部的页面。例如,当用户在`iframe`内部完成某个操作(如登录验证)后,可能需要返回到父页面...

    再iframe中刷新列表

    - 在子页面B中,我们需要首先将想要操作的数据模型(如`vm`)绑定到顶层窗口`window.top`上,使得无论是在哪个层次打开的新窗口都能够访问到这些数据。 ```javascript window.top.vm = vm; // 把vm挂载到顶层窗口...

    Iframe的页面,判断是否登录的时候有时候有问题就需要

    1. **同源策略限制**:浏览器的同源策略限制了不同源之间的脚本交互,这可能阻止Iframe与父窗口或同一页面内的其他Iframe之间的直接通信,除非它们来源于同一个域名或通过CORS(跨源资源共享)机制允许跨域请求。...

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

    即,子页面通过父页面访问另一个iframe中的内容。具体做法是通过父页面中对应的iframe的name属性或者id属性来获取该iframe的DOM对象,然后调用其contentWindow对象的相应方法。例如,在childPage1.html中调用...

    top,parent,opener,iframe

    当页面包含嵌套框架时,`top`始终指向最外层的框架集,允许你从嵌套的框架中访问顶层内容。 2. **parent**: `parent`属性则引用当前框架或窗口的父框架。如果当前窗口或框架没有父框架,`parent`就等于`window`。在...

    js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍

    而刷新上级页面(如果当前页面在框架或iframe中)则可以通过`window.parent`属性来访问父级窗口,并结合`document.location.reload()`执行刷新操作。例如,`window.parent.main.document.location.reload()`会刷新名...

    iframe框架与主框架通信模块例子.zip

    父页面可以通过`window.postMessage()`方法向iframe发送消息,而iframe中的内容可以通过监听`message`事件来接收这些消息。反之亦然。 - **window.name属性**:虽然不是设计用来跨域通信的,但window.name属性在...

    Iframe框架自动适应高度示例详解.pdf

    Iframe(内联框架)是一种HTML页面中可以嵌入另一个HTML...需要注意的是,由于跨域策略的限制,这种高度自适应的方法不能在不同域名之间的Iframe中使用,除非父页面和子页面之间有适当的CORS策略配置允许这种跨域操作。

    jQuery插件EasyUI实现Layout框架页面中弹出窗体到最顶层效果(穿越iframe)

    本文将深入探讨如何利用EasyUI的Window插件在Layout框架页面中实现弹出窗体到最顶层的效果,尤其是当窗体需要穿越iframe时。 首先,我们需要理解jQuery EasyUI的Window组件。Window是EasyUI中的一个动态弹出窗口,...

    js页面跳转的问题(跳转到父页面、最外层页面、本页面)

    3. 最外层页面跳转:当页面是嵌套在多个iframe中时,最外层页面通常是整个浏览器窗口的顶级页面。在子页面中,如果需要直接跳转到最外层的页面,可以使用"top.location.href"属性。"top"对象代表了最外层的窗口对象...

    无刷新 子窗体传值父窗体

    首先,我们需要理解的是,Web应用程序中的窗口分为两种:顶层窗口(顶级窗口)和子窗口(iframe)。在传统的方式中,如果想要从子窗口向父窗口传递数据,通常需要借助于JavaScript事件处理和DOM操作。 1. **...

    js如何判断是否在iframe中及防止网页被别站用iframe嵌套

    window.frames是一个包含当前窗口中所有子窗口(frames)的数组,而parent.frames则指向包含当前iframe的父窗口中所有子窗口的数组。如果当前页面在iframe中,那么window.frames.length将会小于parent.frames.length...

Global site tag (gtag.js) - Google Analytics