javascript – 从跨域iframe中检测方向更改

前端之家收集整理的这篇文章主要介绍了javascript – 从跨域iframe中检测方向更改前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
所以我有一个.jsp页面,其中有一个iframe.此iframe的内容托管在单独的域上.在移动设备上,我正在寻找此iframe来检测方向更改并相应地更改内容的维度.

有没有办法向存储在此iframe内的内容添加一个事件侦听器来检测方向更改?

如果这个内容不在iframe内,而是直接访问,那么调用如下:window.addEventListener(‘orientationchange’,FunctionToBeCalled,false);
成功捕获方向更改并调用相应的功能.但是,我似乎无法让这个在iframe内工作.我已经尝试过parent.addEventListener,parent.window.addEventListener,top.addEventListener等,但无济于事.

从我看过的这个听起来好像是因为这是一个跨域的通话,我有非常有限的父母功能可用于我,我注定要失败?

任何帮助将不胜感激.谢谢!

解决方法

如果您拥有父窗口的代码,您可以使用跨文档垃圾解决这个问题.您可以将方向从父窗口发送到iframe.这也应该在跨域方案中也起作用.
我在 iphone 4.3和 android 2.2上测试了这个.

在父窗口中:注册方向更改并将其传输到iframe

window.addEventListener("orientationchange",function(){
                var iframe = document.getElementById("youriframe").contentWindow;
                iframe.postMessage({
                    orientation: window.orientation
                },'http://the.domain.of.the.iframe.com');
},false)

在iframe中:订阅来自父项的方向更改

window.addEventListener("message",function(e){
            var newOrientationValue = e.data.orientation;
            alert(newOrientationValue); // <--- DO your own logic HERE
},false)

查看更多详情:http://html5demos.com/postmessage2

原文链接:https://www.f2er.com/js/154956.html

猜你在找的JavaScript相关文章