Question

我需要从我的网络应用程序中打印多个PDF并呈现html。是否可以向用户显示打印预览，然后一次打印或者是否需要一个接一个地打印？

以下是我要打印的内容的简短示例，我想在第一段中打印内容，然后是pdf，然后是下一段。

<html>
<body>
<p> 
This is my paragraph<br />
This is my paragraph<br />
This is my paragraph<br />This is my paragraph<br />This is my paragraph<br />This is my paragraph<br />
</p>
<iframe  src="http://www.africau.edu/images/default/sample.pdf" style="width:718px; height:700px;" frameborder="0"></iframe>
<p> 
This is my paragraph<br />
This is my paragraph<br />
This is my paragraph<br />This is my paragraph<br />This is my paragraph<br />This is my paragraph<br />
</p>
</body>

Answer 1

如果我理解，我认为你应该使用object而不是iframe它是这样的：

<body>
    <p>This is my paragraph</p>    
      <object data="http://www.africau.edu/images/default/sample.pdf" type="application/pdf" style="height: 500px;">
          <embed src="http://www.africau.edu/images/default/sample.pdf" type="application/pdf" style="width: 500px;height: 500px;">
      </object>  
  <p>This is my paragraph</p>
  </body>

通过这种方式，您可以在其中预览和打印带有pdf的html。你可以嵌入几个pdf并一次打印，但只是可见部分。

另一种方法可能是使用某些服务器端代码，如wkhtmltopdf并尝试合并pdf，请看：wkhtmltopdf: Is it possible to merge PDF files?

Answer 2

是可以的，但是您将不得不稍微调整我的代码以适合您的需求。

我将通过添加一些id属性来修改您的HTML页面，以使javascript易于选择它们：

<html>
<body>
<p id ='first_paragraph'> 
This is my paragraph<br />
This is my paragraph<br />
This is my paragraph<br />This is my paragraph<br />This is my paragraph<br />This is my paragraph<br />
</p>
<iframe id='first_ifame' src="http://www.africau.edu/images/default/sample.pdf" style="width:718px; height:700px;" frameborder="0"></iframe>

<p id= "second_paragraph"> 
This is my paragraph<br />
This is my paragraph<br />
This is my paragraph<br />This is my paragraph<br />This is my paragraph<br />This is my paragraph<br />
</p>
</body>
</html>

现在，我将通过操纵DOM使用javascript重新排列父窗口的内容。

<script>

 pages =[] // initiate an empty list here

function printPage() {

var p1 = document.getElementById('first_paragraph');
// get the first_paragraph and
// then push its innerHTML into the list
   pages.push(p1.innerHTML); 

var frame1 = document.getElementById('first_ifame');
// get the first_iframe and
// then push its innerHTML into the list
   pages.push(frame1.contentWindow.document.body.innerHTML); 

var p2 = document.getElementById('second_paragraph');
// get the second_paragraph and
// then push its innerHTML into the list
   pages.push(p2.innerHTML); 

if (pages && pages.length) {

// this if statement, just checks to ensure our list is not empty before running the code.

// here is the magic, we now set the parent window to be equal to all the concatenated innerHTML
window.content.document.body.innerHTML = pages;
// then we print this new window that contains all the iframes
window.print();
} 
else {
// do nothing
}


}
</script>

使用此解决方案，您甚至可以避免iframe超过一页时被切断的问题。其次，即使您有多个iframe，您也只会得到一个打印对话框。

请记住，在您的父页面HTML中，您将具有下面的代码来调用printPage函数。

<input type="submit" value="Print All"
  onclick="javascript:printPage()"
 />

打印多个PDF和呈现的HTML

2 个答案: