正文
JS页面打印
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
平常浏览网页和文档的时候，随处可见打印两个字，有时候不小心点到或者快捷键触发到，就会弹出一个打印的页面，上边显示的打印机是GoldGrid Virtual Printer，这是计算机的虚拟打印机，打印后就会生成类似扫描件的pdf文档。当然如果连接了打印机并设置好，可以直接调用到打印机进行真实的打印。
接下来要介绍的是js端进行的一些打印操作：
1.直接调用window的print方法进行打印，效果同直接点击打印，会将整个页面进行打印；
2.局部打印：
页面如下
<h1>不需要打印</h1>
<!--printstart-->
<div>
这里是需要打印的内容
.....
</div>
<!--printend-->
<h1>不需要打印</h1>
js如下
function doPrint() {
var bdhtml=window.document.body.innerHTML;
var printstart="<!--printstart-->";
var printend="<!--printend-->";
prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17 ,bdhtml.indexOf(eprnstr));
window.document.body.innerHTML=prnhtml;
window.print();
}
原理就是将不需要打印的内容手动去除，然后调用window的打印方法打印。
3.过滤打印，与2类似，将不需要打印的内容进行隐藏，如：
<style type="text/css">
@media print {
.noprint{
display: none;
}
}
</style>
<style type="text/css" media="print"> .noprint{ display: none; }</style><!--startprint-->
<div class="content">
<button class="noprint">预览</button>
<button class="noprint">打印</button>
这里是需要打印的内容
.....
</div>
<!--endprint-->
4.使用jqprint进行打印
下载引入jqprint后，使用时直接
$("#ddd").jqprint();
就可以，打印该id元素内的内容，很容易理解。
该方法的参数是一个对象
{ debug: false, importCSS: true, printContainer: true, operaSupport: false }1) debug: false, //如果是true则可以显示iframe查看效果（iframe默认高和宽都很小，可以再源码中调大），默认是false
2) importCSS: true, //true表示引进原来的页面的css，默认是true。（如果是true，先会找$("link[media=print]")，若没有会去找$("link")中的css文件）
3) printContainer: true, //表示如果原来选择的对象必须被纳入打印（注意：设置为false可能会打破你的CSS规则）。
4) operaSupport: false //表示如果插件也必须支持谷歌opera浏览器，在这种情况下，它提供了建立一个临时的打印选项卡。默认是true
