首页 > 代码库 > 关于打印
关于打印
要实现网页打印其实很简单,一个window.print(); 就可以了。 但是往往需求中要求我们打印的不是整个页面,而是部分有用的东西。而window.print();只能打印整个页面。这时就需要分区域的打印。目前发现有以下几种方法。先记成笔记,万一以后忘记了可以再来查阅。
1、CSS控制在打印时不需要打印的部分隐藏起来
(1) bootstrap中的hidden-print可以在打印时将不需要显示的部分隐藏起来。在那一部分的最外层dom元素中加上 class="hidden-print" 即可。
(2)
@media print { .notPrint{ display: none; } }
用@media print将需要隐藏部分display: none; 也可以。此方法还可以修改打印时的样式。
2、JS拼接字符串的方法将需要打印的地方拼接起来。以下是前段时间项目中打印的代码:
var wHtml=document.body.innerHTML; //先将页面dom保存起来 var printData=http://www.mamicode.com/$(‘#CC-orderDetial‘).html(); //构造需要打印部分 document.body.innerHTML = printData; /将需要打印部分赋值给当前页面 window.print(); //打印 document.body.innerHTML=wHtml; //还原原来的页面 document.location.reload(); return false;
以上几种方法虽然可以实现部分打印,但还隐藏着一个小bug。如果需要打印部分有<a href="http://www.mamicode.com/www.aaa.com">XXX</a>, 你在chrome打印预览的时候会发现href中的内容也会被打印出来。把href="http://www.mamicode.com/www.aaa.com" 替换成空格即可。bbb.replace(/href=http://www.mamicode.com/g,"");
关于打印
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。