摘要:之前很少使用这个标签,因为感觉到父子页面之间传递数据不太方便。最近同事做的一组页面中大量的使用了用来嵌入其他页面,由于懒所以只好看看如何在的标签下传递数据。在父页面中使用函数来向子页面发送消息而在子页面中添加这个来接受消息。
之前很少使用IFRAME这个标签,因为感觉到父子页面之间传递数据不太方便。最近同事做的一组页面中大量的使用了IFRAME用来嵌入其他页面,由于懒,所以只好看看如何在IFRAME的标签下传递数据。
在网上找了找相关的资料,方法确实不少,这里只说我实际用到过的两种方法:
1. 在子页面中用parent属性也引用父页面的内容,但是好像只在IE中能够使用,在CHROME和Firefox始终没有反应。
2. 在父页面中使用document.getElementById("test").contentWindow.postMessage(message, "*");函数来向子页面发送消息;而在子页面中添加window.addEventListener("message", onmessage, false);这个Listener来接受消息。不过在这种方法中值得注意的一点是,最好能将发送消息的postMessage函数包含在$("#test").load(function(){});中,因为如果不使用load的话,很有可能消息在子页面的Listener添加之前就发送出去了,那么子页面是无法接受到任何消息的。
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/77975.html
摘要:一原理篇下面分别介绍和与的底层交互原理在讲解原理之前,首先来了解下的组件,先来看一下苹果官方的介绍上面的意思是说是一个可加载网页的对象,它有浏览记录功能,且对加载的网页内容是可编程的。 做过混合开发的很多人都知道Ionic和PhoneGap之类的框架,这些框架在web基础上包了一层Native,然后通过Bridge技术使得js可以调用视频、位置、音频等功能。本文就是介绍这层Bridge...
摘要:四传递信息给父页面参考跨域子页面传给父页面父页面代码崔涣测试父页面参数中有属性,就是父窗口发送过来的数据把父窗口发送过来的数据显示在子窗口中。五简单分析和安全问题传送过来的信息如下图,几乎包含了所有应该有的信息。 背景:由于同源策略存在,javascript的跨域一直都是一个棘手的问题。父页面无法直接获取iframe内部的跨域资源;同时,iframe内部的跨域资源也无法将信息直接传递给...
阅读 1685·2021-11-25 09:43
阅读 2638·2019-08-30 15:53
阅读 1784·2019-08-30 15:52
阅读 2882·2019-08-29 13:56
阅读 3295·2019-08-26 12:12
阅读 553·2019-08-23 17:58
阅读 2101·2019-08-23 16:59
阅读 908·2019-08-23 16:21