IFrame Resizer 不调整大小

Question

我正在此处处理此页面：http://factor1hosting.com/~dnaz/wordpress/certifications/

我正在尝试引入跨域 iframe。

我正在使用 @DavidJBradshaw's iFrame Resizer 来实现这一点。但是，我没有让 iframe 正常工作。

我可以只使用普通的 javascript init:

<script>iFrameResize({log:true})</script>

当我使用它时，我确实得到了日志，但它没有调整大小。我也试过 jQuery 方法：

$('iframe').iFrameResize( [{log: true}] );

并且不要调整日志或 iframe 的大小。我还尝试将它包装在一个准备好的文档中，但也没有实现。

有人对为什么不能正确触发有任何想法吗？我的控制台没有抛出任何 JS 错误...谢谢！

编辑： 这是我目前如何在 HTML 端设置的示例。

<iframe src="http://phpstack-9420-21004-48731.cloudwaysapps.com/onlinecert/certification/login" width="100%" scrolling="no"></iframe>
                <script>
                    jQuery(document).ready(function () {
                        jQuery('iframe').iFrameResize( [{log:true}] );
                    });
                </script>

编辑 2：这是我的控制台日志，当它触发时，它将 iframe 设置为 150px，即使内容延伸的时间比那个长。

[iFrameSizer][Host page] Added missing iframe ID: iFrameResizer0 (http://phpstack-9420-21004-48731.cloudwaysapps.com/onlinecert/certification/login)
iframeResizer.js:97 
[iFrameSizer][Host page] IFrame scrolling disabled for iFrameResizer0
iframeResizer.js:97 
[iFrameSizer][Host page][init] Sending msg to iframe (iFrameResizer0:8:false:true:32:true:true:null:offset:null:null:0:false:parent)
iframeResizer.js:97 
[iFrameSizer][Host page][iFrame.onload] Sending msg to iframe (iFrameResizer0:8:false:true:32:true:true:null:offset:null:null:0:false:parent)
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] HTML & body height set to "auto"
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Enable public methods
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Animation Start
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Animation Iteration
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Animation End
iframeResizer.contentWindow.js:62 .
[iFrameSizer][iFrameResizer0] Added event listener: Device Orientation Change
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Transition End
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Window Clicked
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Enable MutationObserver
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] In page linking not enabled
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Trigger event lock on
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Sending message to host page (iFrameResizer0:150:703:init)
iframeResizer.js:97 
[iFrameSizer][Host page] Received: 
[iFrameSizer]iFrameResizer0:150:703:init
iframeResizer.js:97 [iFrameSizer][Host page] Checking connection is from: http://phpstack-9420-21004-48731.cloudwaysapps.com
iframeResizer.js:97 
[iFrameSizer][Host page] Checking height is in range 0-Infinity
iframeResizer.js:97 
[iFrameSizer][Host page] Checking width is in range 0-Infinity
iframeResizer.js:97 
[iFrameSizer][Host page] Requesting animation frame
iframeResizer.js:97 
[iFrameSizer][Host page] IFrame (iFrameResizer0) height set to 150px
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Trigger event lock off
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] --

Answer 1

知道了！

iframe 主体高度计算不正确，因此我更改了计算 iframe 高度的方式。我正在使用 'lowestElement' 来实现这一点，效果很好。

iFrameResize({
    log                     : true,                  // Enable console logging
    enablePublicMethods     : true,                  // Enable methods within iframe hosted page
    heightCalculationMethod : 'lowestElement',
});

来自 GitHub 存储库：lowestElement 遍历 DOM 中的每个元素并找到最低点

Answer 2

我遇到了完全相同的问题。而且，这个问题真的很意外。

iFrameResize([{log: true}], yourIframe); 不会调整大小。

但是，iFrameResize({log: true}, yourIframe); 会完美调整大小。
请从选项中删除数组 [{log: true}] 并仅保留对象 {log: true}.

这很令人困惑，因为我从 GitHub 页面复制了初始化代码，上面写着：const iframes = iFrameResize( [{options}], [css selector] || [iframe] ); :D

看来OP也犯了同样的错误。希望对大家有帮助。

IFrame Resizer 不调整大小

IFrame Resizer not resizing

javascript

jquery

iframe-resizer