Chrome 65无法打印隐藏的iframe

时间:2018-03-14 15:05:16

标签: javascript css google-chrome iframe

我偶然发现了关于iframes的Chrome 65错误。

我无法使用代码段来演示此内容,因此我使用了此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:不要尝试将其编辑为代码段,iframe在其中无效。​​

1 个答案:

答案 0 :(得分:8)

可能是故意改变的,但我不知道该如何确定。如果你想去探索,这个变化似乎是https://crrev.com/526112;谷歌文档有一些后果,所以你并不是唯一一个试图解决这个问题的人。

我可以使用

解决这个问题
visibility: hidden;
position: absolute;
在iframe上

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