时间戳

首页 > 解决方案 > 从中获取事件后获取 iframe 的实例

javascript - 从中获取事件后获取 iframe 的实例

问题描述

我看到了很多从 iframe 进行交流的帖子。但我的问题是在那之后。

我从 iframe 获得了父级的事件，现在我想获取 iframe 的实例，以便我可以要求 jquery 根据从 iframe 传递的 msg 设置高度。

简而言之，我试图定义一些常见的 msg 来从 iframe 到父级进行通信。消息之一是改变它的高度。这样一个通用的方法可以从一个或多个 iframe 接收消息并改变它们的高度。

父代号-----

var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

// Listen to message from child window
eventer(messageEvent,function(e) {

    msgData = $.parseJSON(e.data);

    if(msgData.iframeload){

        if(msgData.iframeload.height){
             $(e.source).css('height',''+msgData.iframeload.height);
        }
    }

},false);

iframe代码----

var msgToParent = {
iframeload : {
          height : window.document.body.scrollHeight
        }
};
parent.postMessage(JSON.stringify(msgToParent),"*");

我的问题是我应该写什么代码来替换

$(e.source).css('height',''+msgData.iframeload.height);

如果我用 iframe 的 id 更改它，那么它就起作用了。所以我想要一种方法来获取 iframe 的对象，它可以帮助我设置高度。

$('#<id of iframe>').css('height',''+msgData.iframeload.height);

标签： javascriptjqueryhtmliframe

解决方案

好肮脏的头脑总是有效... :) 这就是我所做的，并在 iframe 的 msg 中添加了一个 src 作为额外元素作为 document.location.href ... 

var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

// Listen to message from child window
eventer(messageEvent,function(e) {

    msgData = $.parseJSON(e.data);

    if(msgData.iframeload){

        if(msgData.iframeload.height){

            $.each($('iframe'),function(i,curIfra){

                if(msgData.src==curIfra.src){
                    $(curIfra).css('height',''+msgData.iframeload.height);
                }
            });
        }
    }

},false);

推荐阅读