Question

我在Safari上打印时遇到问题。我的系统是Windows 7，此功能在除Safari之外的所有其他浏览器中都能正常运行。情况如下：

window.onload = function(){
    console.log('before print');
    window.print();
}

它不会输出登录控制台面板，但首先会出现打印页面，在打印页面中选择取消后，将输出日志。

有没有人提出这个问题？任何帮助将不胜感激。

更新

以下是我的情况：我们需要打印一个页面，其内容可以由用户通过选中和取消选中复选框进行更改，并且只打印此页面的内容部分，因此我们创建一个仅包含要打印内容的新页面。在此页面中，我们需要隐藏用户未选择的不必要内容，因此我们需要在调用window.print()之前执行一些DOM操作。 console.log()只是观察的示例代码。我尝试在测试HTML中添加<div id='test'>Test HTML</div>并添加

var test = document.getElementById('test');
test.style.background = 'yellow';

在window.print();之前，它在我的Safari浏览器中显示相同的结果，“测试HTML”在我单击打印面板中的取消按钮之前不会变为黄色，因此不仅仅是console.log问题

更新

我在Windows 7上使用Safari 5.1.7（7534.57.2）

Answer 1

这是奇怪的行为。我在Mac上的Safari 6.1中测试过。

但是我可以问为什么你需要在打印前记录一些东西？因为似乎在打印面板弹出之前正在执行所有功能：

<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>

<script>
window.onload = function() {

    $('body').html('before print');

    console.log('before print');

    window.print();
};
</script>

当您查看打印预览时，页面上会显示“打印前”文字。出于某种原因，控制台将仅在打印面板关闭时记录文本，但在我看来，这对您的访问者来说并不重要。您可以根据需要在打印过程之前操作DOM并更改页面。

Answer 2

经过多次尝试，下面代码有效，但我不知道原因，有人可以解释一下吗？或者这是Safari Bug？

window.onload = function() {
    $('body').html('After change');
    setTimeout(window.print, 1000);
};

Answer 3

对我来说，setTimeout解决方案不起作用。我发现这个jQuery插件https://github.com/jasonday/printThis有很多window.print()的解决方法，因为它似乎并不是所有浏览器都完全支持。

我选择了适用于我的Safari document.execCommand("print", false, null)

这一行

这对我现在在safari和chrome

中工作正常

try {
  document.execCommand('print', false, null);
}
catch(e) {
  window.print();
}

Answer 4

与其他浏览器不同，Safari在加载页面之前先打印页面。因此，可以在新打开的html页面的代码中使用window.onload（）。但是，如果打开的页面不是html内容，则不可能。以下解决方案适用于所有浏览器，并且内容类型开放。

var printWindow = window.open(url, '_blank');
$(printWindow).load(function()
{
    this.print();
});

Answer 5

添加另一种适用于我的情况的解决方案：

首先创建您的弹出窗口。

$( ".myButton" ).click(function() {
    var url = 'www.google.com';
    var printWindow = window.open( url, '_blank');  
    printWindow.focus();
});

然后，在弹出窗口中加载的HTML页面内：

$(window).bind("load", function() {

    setTimeout( function () { 

      try {
        document.execCommand('print', false, null);
      }
      catch(e) {
        window.print();
      }

    }, 500);

});

使用javascript window.print（）进行Safari打印问题

5 个答案: