Question

我正在尝试将div的内容打印到新选项卡，但是，它仅首次打印空白页。当我手动打印页面时，它工作正常。我正在加载包含在div中的2个表。

HTML结构：

<div class="receipt_bg" id="print_receipt">
  <div id="div1">
    table1
  </div>
  <div id="div2">
    table2
  </div>
</div>
<button type="button" id="print_btn">Print</button>

使用Javascript：

$('#print_btn').click(printClick);

function printClick(receipt_bg) {
  var DocumentContainer = $('.receipt_bg').html();
  var WindowObject = window.open("PrintWindow","_blank");
  WindowObject.document.writeln('<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">'+ '<html><head><title>test print receipt</title>    <link href="../css/style.defaultprint.css" rel="stylesheet" type="text/css" /></head><body>' +     DocumentContainer + '</body></html>')
  setTimeout(WindowObject.print(), 5);
  WindowObject.close();
}

我甚至尝试过使用 WindowObject.onload = WindowObject.print（）; 代替 setTimeout（WindowObject.print（），5）; 它仍然似乎没有用。我看到了类似的帖子，但它的解决方案对我不起作用。

Answer 1

检查此网址。它包含很少的从页面打印内容的示例。它拥有您所需要的一切。

我曾使用jQuery Print Element 1.2进行打印，如果你有大量内容要打印，那么你需要将时间从50增加到500，否则它会在你遇到问题时显示空白页面，但对我来说它只发生在Chrome浏览器中，除此之外我还没有遇到过这个问题。检查printElement js。下面的url包含演示和源代码的好例子。

请检查：jQuery Print Page Options

以下是代码，它将为您提供帮助。

function printClick(receipt_bg) {
    var DocumentContainer = $('.receipt_bg').html();
    var WindowObject = window.open("", "printElementWindow", "width=650,height=440,scrollbars=yes");
    WindowObject.document.writeln('<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">'+ '<html><head><title>test print receipt</title>    <link href="../css/style.defaultprint.css" rel="stylesheet" type="text/css" /></head><body>' +     DocumentContainer + '</body><script type="text/javascript">setTimeout(printPage(),1000);  function printPage(){focus();print();}<\/script></html>')
    WindowObject.close();
 }

这对你有用，在这里我给你的窗口代码添加了一个javascript函数，它会在超时后执行。尝试一下，让我知道，它对你有用吗？您可以根据您的内容延长或终止超时。

在新选项卡中打印内容打印空白页

1 个答案: