Chrome 65 无法打印隐藏的 iframe

Posted

技术标签:

【中文标题】Chrome 65 无法打印隐藏的 iframe【英文标题】:Chrome 65 can't print hidden iframe 【发布时间】:2018-08-23 04:25:44 【问题描述】:

我偶然发现了一个似乎是关于 iframes 的 Chrome 65 错误。

我无法使用 sn-p 来演示这一点,所以我使用了这个JSFiddle。

问题在于,如果iframedisplay: none;,则.print() 上的iframe 将不会打印任何内容。

它只发生在 Chrome 65 上,而不是 Chrome 64。

代码如下:

<iframe id="frame"></iframe>
<iframe id="frame2" class="hidden"></iframe>
<button class="db">Print without display: none;</button>
<button class="dn">Print with display: none;</button>

$('.db').on('click',function()
    $('#frame').contents().find('body').append('<p>Test without <code>display: none;</code>!</p>')
  $('#frame')[0].contentWindow.print();
);

$('.dn').on('click',function()
    $('#frame2').contents().find('body').append('<p>Test with <code>display: none;</code>!</p>')
  $('#frame2')[0].contentWindow.print();
);

.hidden
  display: none;

PS:不要尝试将其编辑为 sn-p,iframe 在其中不起作用。

【问题讨论】:

chromium.googlesource.com/chromium/src/+log/… — DisplayNoneIFrameCreatesNoLayoutObject 似乎相关。 @JoshLee 谢谢,但我必须说我不知道​​如何处理这些信息! 我假设您希望 display none iframe 在显式打印时打印?这在 Chrome 的 beta 版 (66) 上仍然存在问题,但它在金丝雀版 (67) 中有效,所以看起来这个问题将得到修复。 @Necreaux 很高兴知道这不仅仅是预期的行为,谢谢! 【参考方案1】:

可能是故意改变的,但我知道的不够肯定。如果你想去探索,变化似乎是https://crrev.com/526112; Google Docs 有一些影响,所以你不是唯一一个试图解决这个问题的人。

我可以通过使用来解决它

visibility: hidden;
position: absolute;

在 iframe 上模拟display: none 将其从正常流程中取出但仍允许其执行自己的布局的效果。 https://jsfiddle.net/28w1tomv/

【讨论】:

sigh 我有很多像这样使用iframes 的模块,看到这种机制在没有任何警告的情况下发生变化很烦人......无论如何,谢谢你的提示,我'让问题开放一段时间,希望有人能给出明确的答案。 只是确认我遇到了与描述完全相同的问题,并且此解决方案也对我有用!

以上是关于Chrome 65 无法打印隐藏的 iframe的主要内容,如果未能解决你的问题,请参考以下文章

Youtube iframe api allow="autoplay" Chrome 65

无法通过 chrome 扩展与 iFrame 交互

溢出:隐藏;不适用于带有 IFRAME 的 Chrome?

隐藏 iframe 上的水平滚动条?

如何打印隐藏 iframe 的内容?

在 IE 中打印隐藏的 iFrame