项目中用的是谷歌浏览器,js 执行window.print() 就会调用谷歌浏览器的打印功能。
打印其实打印的是整个当前网页,只是用媒体查询(@media print)把网页中要打印的内容做了显示,不打印的内容做了隐藏而已。
针式打印机由于存在失真问题,所以像有些边框颜色设置的比较浅的就没法打印出来,可以设置边框颜色深一点。
<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title></head><style>.printonly{display:none}@media print{input,.noprint{display:none}.printonly{display:block;width:50%}}/**.printonly{display:none}不能写到这里,会导致打印时printonly的内容也不显示*/</style><body><div class="noprint">这段打印时不显示</div><div class="printonly"><h1>这段打印时会显示</h1><hr>This is print-only</div><input onClick="print()" value="点击打印" type="button"></body></html>