打印技术分享
前辈们好! 这是我第一次分享自己项目中遇到的坑,如有错误,请指正
这次分享的内容是自己在项目中需要实现打印功能所遇到的坑以及自己查到的解决方法;
打印内容的设置;
如果是打印固定的内容,可以直接写入标签
htmlnode = “<img src=’”+imagesUrlFirst+"’’>";
新打开一个页面 :newwindow = window.open("", “”,);
用document.write将自己需要打印的内容写入进去: newwindow.document.write(htmlnode);
这样在新的页面就可以看到自己打印的内容;
然后再通过css设置媒体查询@memedia去设置自己打印需要的样式;注:样式最好写在style标签中,然后添加在你创建的元素之前;
然后再直接调用打印API就行(我自己用的浏览器自带的打印,没有用打印框架;可以尝试打印框架);这个时候的打印API就不是window.API,而是newwindow.print();
然后自己打印完成之后遇到的问题就是在打印预览的时候点击取消或者打印需要关闭新打开的页面,然后就一直在查找监听打印预览页面时候点击的是打印还是取消,最后通过知识分享才进行了打印或者取消然后关闭新打开的页面.用到的技术是window.matchMedia(‘print’),有一个matches参数,不管是打印还是取消都会返回,然后再去操作;这样就可以关闭打印时候新打开的页面