JS实现打印功能(包括打印预览、打印设置等) 及 window.onload用法详解
【摘要】 绪最近在进行项目开发时，需要实现后台管理端打印功能，遂在网上一阵搜索，搜到了很多相关的文章。其中绝大部分文章都是使用的Lodop5.0(Web打印和套打控件)控件，而且有些环境下还不能使用。如有想使用此控件实现打印功能的盆友，可点击进行下载。但我强烈推荐下面的方法，即利用系统本身的打印属性实现打印功能。简单的一条系统调用命令即可实现。前提条件:进行的电脑必须连接有打印机,至于判断PC是否连接...
绪
最近在进行项目开发时，需要实现后台管理端打印功能，遂在网上一阵搜索，搜到了很多相关的文章。其中绝大部分文章都是使用的控件，而且有些环境下还不能使用。如有想使用此控件实现打印功能的盆友，可点击进行下载。但我强烈推荐下面的方法，即利用系统本身的打印属性实现打印功能。简单的一条系统调用命令即可实现。
前提条件:
进行的电脑必须连接有打印机,至于判断PC是否连接打印机的问题还未能解决，欢迎有解决方法的朋友留言，小生不胜感激!
代码
介绍两个关键的css
<style media="print">
.Noprint { DISPLAY: none }
.PageNext{ PAGE-BREAK-AFTER: always }
</style>
第一个在不需要打印的标签上添加（子标签也将不被打印），第二个在需要换行的标签处添加（该标签所表示的内容将在当前打印的一页内）
基本的做法就是直接调用系统打印功能，如下代码所示:
window.print()；
就可实现页面局部打印了，很easy吧！而且可以实现打印预览、设置等操作。
window.onload用法详解
网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行，否则可能导致无法获取对象的情况，为了避免这种情况的发生，可以使用以下两种方式:
一.将脚本代码放在网页的底端，这样在运行脚本代码的时候，可以确保要操作的对象已经加载完成。
二.通过window.onload来执行脚本代码。
第一种方式感觉比较凌乱（其实推荐使用），往往我们需要将脚本代码放在一个更为合适的地方，那么window.onload方式就是一个良好的选择。window.onload是一个事件，当文档加载完成之后就会触发该事件，可以为此事件注册事件处理函数，并将要执行的脚本代码放在事件处理函数中，于是就可以避免获取不到对象的情况。
【版权声明】本文为华为云社区用户原创内容，未经允许不得转载，如需转载请自行联系原作者进行授权。如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）