Iframe resizer 嵌套的iFrame，父对象不调整大小'；不要冒泡

我的结构如下：

0. Parent page
    1. iFrame rendered through ad delivery network
        2. iFrame displaying the advertisement

广告设置为当用户与广告交互时，通过parentIFrame.size（）方法调整父iFrame的大小。我已经对这个部件进行了设置，并且工作正常——我可以在Level 2 iframe上看到内联样式属性的更改

现在，通过查看，我可以看到嵌套的iFrame可以一起工作，并且可以通过嵌套的级别适当地调整大小。我看到中间级别的iFrame必须同时具有contentWindow和iframesize文件

考虑到我的2级iframe可以正常工作并调整大小，我假设1级和2级之间的通信可以正常工作，我的问题在0级和1级之间。我已经设置了一个iFrameResize日志，并故意在级别2内关闭了它

如果查看控制台，当广告呈现时，您会注意到如下内容：

[iFrameSizer][Host page] IFrame scrolling disabled for sas_i30430
[iFrameSizer][Host page][init] Sending msg to iframe (sas_i30430:8:false:true:32:true:true:null:offset:null:null:0)
[iFrameSizer][Host page][iFrame.onload] Sending msg to iframe (sas_i30430:8:false:true:32:true:true:null:offset:null:null:0)
[iFrameSizer][sas_i30430] HTML & body height set to "auto"
[iFrameSizer][sas_i30430] Enable public methods
[iFrameSizer][sas_i30430] Enable MutationObserver
[iFrameSizer][sas_i30430] Trigger event lock on
[iFrameSizer][sas_i30430] Sending message to host page (sas_i30430:250:300:init)
[iFrameSizer][Host page] Received: [iFrameSizer]sas_i30430:250:300:init
[iFrameSizer][Host page] Checking height is in range 0-Infinity
[iFrameSizer][Host page] Checking width is in range 0-Infinity
[iFrameSizer][Host page] Requesting animation frame
level 2. registering handler -- resizing to 250, 300
[iFrameSizer][Host page] IFrame (sas_i30430) height set to 250px
[iFrameSizer][sas_i30430] Trigger event: mutationObserver: [object HTMLIFrameElement] attributes
[iFrameSizer][sas_i30430] No change in size detected
[iFrameSizer][sas_i30430] Trigger event lock off
[iFrameSizer][sas_i30430] --

然后，当您单击该广告时，将显示以下内容：

level 2. expand action -- resizing to 250, 482
[iFrameSizer][sas_i30430] Trigger event: mutationObserver: [object HTMLIFrameElement] attributes
[iFrameSizer][sas_i30430] No change in size detected

您可以看到，我正在记录级别2的事件，以帮助分段日志。第二级iFrame调整了大小，但是第1级iFrame没有观察到大小变化的最后一部分是我断开连接的地方

级别0具有以下功能：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="http://cachicha.tv/utils/ads/rich-media/assets/js/iframeResizer.min.js"></script>
<script>
    jQuery(function($) {
        $('.adunit').find('iframe').iFrameResize({
            log: true,
            checkOrigin: false,
            autoResize: true,
            enablePublicMethods: true,
        });
    });
</script>

jQuery（函数（$）{
$（'.adunit'）。查找（'iframe'）。iframesize({
日志：是的，
checkOrigin:false，
自动调整大小：正确，
enablePublicMethods:true，
});
});

第1级有以下内容（我知道这很奇怪，但对于广告网络来说是必要的……这部分正在工作。我提供它是为了完整性）：

变量脚本=[
"http://cachicha.tv/utils/ads/rich-media/assets/js/iframeResizer.min.js",
"http://cachicha.tv/utils/ads/rich-media/assets/js/iframeResizer.contentWindow.min.js"
];
var jQueryScriptLoaded=函数（）{
//在jquery之后加载其他脚本
对于（var i=scripts.length-1；i>=0；i--）{
var元素=document.createElement（“脚本”）；
element.onload=函数（）{
scriptsLoaded（）；
};
element.src=脚本[i]；
document.getElementsByTagName（'head'）[0].appendChild（元素）；
};
};
var scriptsLoaded=函数（）{
//一旦所有脚本都按正确的顺序加载，FirejQuery就会启动
jQuery（函数（$）{
$（'iframe'）.prop（'width'，''）.prop（'height'，'100%”）；
$（'iframe'）。iframesize({
//log:true，//启用控制台日志记录
enablePublicMethods:true，//在iFrame托管页面中启用方法
sizeHeight:没错，
sizeWidth：是的，
checkOrigin:false，
自动调整大小：false，
});
});
}
//首先加载jquery。
var jqueryScript=document.createElement（'script'）；
jqueryScript.onload=函数（）{
jQueryScriptLoaded（）；
};
jqueryScript.src=”https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.2/jquery.min.js";
document.getElementsByTagName（'head'）[0].appendChild（jqueryScript）；

级别2具有contentWindow脚本和parentIFrame.size（）调用

---

提前感谢您的帮助

我认为问题在于在jQuery中将内部iFrame的高度设置为100%

<script type="text/javascript">
    var scripts = [
        "http://cachicha.tv/utils/ads/rich-media/assets/js/iframeResizer.min.js",
        "http://cachicha.tv/utils/ads/rich-media/assets/js/iframeResizer.contentWindow.min.js"
    ];

    var jQueryScriptLoaded = function() {
        // load the other scripts after jquery
        for (var i = scripts.length - 1; i >= 0; i--) {
            var element = document.createElement("script");
            element.onload = function() {
                scriptsLoaded();
            };
            element.src = scripts[i];
            document.getElementsByTagName('head')[0].appendChild(element);
        };
    };

    var scriptsLoaded = function() {
        // fire jquery onces all scripts are loaded in the right order
        jQuery(function($) {
            $('iframe').prop('width', '').prop('height', "100%");

            $('iframe').iFrameResize({
                // log                     : true,                  // Enable console logging
                enablePublicMethods     : true,                  // Enable methods within iFrame hosted page
                sizeHeight              : true,
                sizeWidth               : true,
                checkOrigin             : false,
                autoResize              : false,
            });
        });
    }

    // load jquery first.
    var jqueryScript = document.createElement('script');
    jqueryScript.onload = function() {
        jQueryScriptLoaded();
    };
    jqueryScript.src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.2/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(jqueryScript);

</script>