用window.print()打印指定div里面的内容

最新推荐文章于 2024-02-01 15:38:43 发布

L511157586

最新推荐文章于 2024-02-01 15:38:43 发布

阅读量566

点赞数

文章标签： javascript php ViewUI

原文链接：http://www.cnblogs.com/dean-Wei/p/3283992.html

版权

用window.print()打印指定div里面的内容

今天客户让添加个打印证照功能，直接用window.print()打印的是整个页面，而用以下方法就可以只打印证明了

1. 1. 
  6. <html>
  7. <head>
  8. <script language="javascript">
  9. function printdiv(printpage)
  10. {
  11. var headstr = "<html><head><title></title></head><body>";
  12. var footstr = "</body>";
  13. var printData = document.getElementById("dvData").innerHTML; 获得 div 里的所有 html 数据
  14. var oldstr = document.body.innerHTML;
  15. document.body.innerHTML = headstr+newstr+footstr;
  16. window.print();
  17. document.body.innerHTML = oldstr;
  18. returnfalse;
  19. }
  20. </script>
  21. <title>div print</title>
  22. </head>
  24. <body>
  25. //HTML Page
  26. //Other content you wouldn't like to print
  27. <input name="b_print" type="button"class="ipt" onClick="printdiv('div_print');" value=" Print ">
  29. <div id="div_print">
  31. <h1 style="Color:Red">The Div content which you want to print</h1>
  33. </div>
  34. //Other content you wouldn't like to print
  35. //Other content you wouldn't like to print
  36. </body>
  38. </html>

同理：

用 JavaScript 实现页面数据的打印：主要是用到了一个 print() 函数，该函数将会打印整个 web 页面 body 内的所有 html 数据 ! 使用方法为 window.print(); 打印页面上局部的数据，则可以用

//把数据嵌套在一个 div 里，获得 div

var printData = document.getElementById("dvData").innerHTML; 获得 div 里的所有 html 数据

window.document.body.innerHTML = printData; //把 html 里的数据复制给 body 的 html 数据，相当于重置了整个页面的内容
window.print(); // 开始打印

这种打印方式的优劣：消耗资源少 | 格式不够灵活

（转http://www.cnblogs.com/qingtaong/archive/2012/07/27/2611716.html）

我们知道IE下用window.print()能自动动用打印功能，但是打印的是整个web页面，如果我们只想对页面中的某一部分进行打印，该怎么办呢？
很简单，利用iframe将需要打印的部分以src的方式置于另一个独立页面中，然后在调用window.print()时，使用parent.iframnam.focus()，使得该iframe获得焦点，然后打印即可。
<iframe name="iframename" src="needprintdata.php"></iframe>
<a href="#" onClick="parent.iframename.focus();window.print();">打印</a>

转载于:https://www.cnblogs.com/dean-Wei/p/3283992.html

L511157586

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
用window.print()打印指定div里面的内容

用window.print()打印指定div里面的内容今天客户让添加个打印证照功能，直接用window.print()打印的是整个页面，而用以下方法就可以只打印证明了<!--window.print打印指定div window.print可以打印网页，但有时候我们只希望打印特定控件或内容，怎么办呢？首先我们可以把要打印的内容放在div中，...
复制链接

扫一扫