IT全栈 华强工作室

No Silver Bullet 吾国泱泱 华夏栋梁 以梦为马 不负韶华

网站开发进阶(十二)JS实现打印功能(包括打印预览、打印设置等)

JS实现打印功能(包括打印预览、打印设置等)

最近在进行项目开发时,需要实现后台管理端打印功能,遂在网上一阵搜索,搜到了很多相关的文章。其中绝大部分文章都是使用的Lodop5.0(Web打印和套打控件)控件,而且有些环境下还不能使用。如有想使用此控件实现打印功能的盆友,可点击进行下载。但我强烈推荐下面的方法,即利用系统本身的打印属性实现打印功能。简单的一条系统调用命令即可实现。

前提条件:

进行的电脑必须连接有打印机,至于判断PC是否连接打印机的问题还未能解决,欢迎有解决方法的朋友留言,小生不胜感激!

代码

介绍两个关键的css

<style media="print">

         .Noprint { DISPLAY: none }

         .PageNext{ PAGE-BREAK-AFTER: always }

 </style>

第一个在不需要打印的标签上添加(子标签也将不被打印),第二个在需要换行的标签处添加(该标签所表示的内容将在当前打印的一页内)

基本的做法就是直接调用系统打印功能,如下代码所示:

window.print();

就可实现页面局部打印了,很easy吧!而且可以实现打印预览、设置等操作。

阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/sunhuaqiang1/article/details/49950835
文章标签: javascript 打印功能
个人分类: Web Development
所属专栏: 网站开发进阶
上一篇AngularJS进阶(九)控制器controller之间如何通信
下一篇网站开发进阶(十三)window.onload用法详解
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭