打印jQuery.print.min.js 使用总结-程序员宅基地

技术标签: jsp  

项目中遇到打印报表的要求,需要只打印报表部分而不是整个页面,一般直接调用系统的方法window.print(),会打印整个页面,发现jQuery.print.min.js 很好用,下面和大家分享下打印制作过程成中遇到的问题和解决方法。

使用方法

1.引入jquery 和 jQuery.print.min.js
2.调用(如下)

    //打印
    $("打印按钮").on('click',function () {
            $("需要打印展示的元素").print({
                globalStyles:false,
                mediaPrint:true,
                iframe:false,
                stylesheet:'../commons/css/printBicycle.css' 
            })

    })
参数 默认值 描述
globalStyles true 是否使用父文档的样式表
mediaPrint false 是否使用含有media=”print”的样式表
stylesheet null 链接外部样式表
noPrintSelector “.no-prin” 非打印内容选择器
iframe true 是否使用一个隐藏的iframe来进行打印,也赋值一个已有的iframe的选择器
append null 后置打印的自定义html
prepend null 前置打印的自定义html
manuallyCopyFormValues true 打印时是否更新的表单数据
deferred $.Deferred() 在window.print()调用后resolve一个jQuery.Deferred对象
timeout 750 从iframe或者新窗口加载打印数据的超时时间

打印的样式

引入方式:

1.使用link标签就像通常在html页面中引入样式表一样,不过附加一个额外的media属性,如下面这样:

<link rel="stylesheet" href="print.css" media="print" />

2.使用@media规则可以在通用的样式表中,使用@media规则指定样式用于打印,比如这样:

@media print {
  selector{
  ...
  }
}

3.使用@import

@import url(print-style.css) print;

个人项目中使用的插件调用的方式(使用如下),由于项目采用了easyui的tab切签,即使引入了不同的样式表,打开多个切签后,打印样式会互相影响;采用插件自带的引入外部样式的属性,能避免这个问题。

stylesheet:'../commons/css/printBicycle.css' 

打印css的控制(以下样式变更只能改变打印的默认值,排除客户自行调整的情况)

纵向

@page { size: portrait; }

横向

@page { size: landscape; }

去掉页眉页脚

@page {
    size: A4 landscape;  /*A4纸,横向打印*/
    margin: 0;/*去掉页边距*/
}

遇到的问题

  1. 问题:插件中iframe默认的属性是true,意思是在当前窗口打开打印功能,这样的话打印的报表页眉的标题为文档的<title></title>里面的内容,页脚会有当前网址,客户不喜欢。
    解决方式:调用时 iframe:true,这样的话点击打印会新开个窗口(没有标题,没有网址),就能去掉页眉页脚中不喜欢的标题和网址。
  1. 问题:当遇到数据量较大的情况,浏览器会自动切割,分成多个页面,当去掉页眉页脚时,由于打印机的边距问题,会造成边框周围的数据没打印上。
    解决方法: 增加上下的页边距 @page {margin: 50px 0;}
  1. 问题:打印的报表内容超出纸张大小
    解决方式: 添加缩放zoom(个人比较喜欢这种缩放,看起来比较锐利,字体不会缩小,ps:同时能解决浏览器切割后,造成的描边错位情况);使用如下
  <!--html部分需要给打印的部分加个父元素-->
<div class='需要打印的元素'>
  <table>
    //.....  
  </table>
</div>
.需要打印的元素{zoom:.4}


 

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/cnq2328/article/details/90694493

智能推荐

用gensim对中文维基百科语料上的word2Vec相似度计算实验_gensim 语义相似度-程序员宅基地

文章浏览阅读3.8k次,点赞4次,收藏10次。Word2vec 是Google在 2013年年中开源的一款将词表征为实数值向量的高效工具,其利用深度学习的思想,可以通过训练,把对文本内容的处理简化为 K 维向量空间中的向量运算,而向量空间上的相似度可以用来表示文本语义上的相似度。Word2vec输出的词向量可以被用来做很多 NLP相关的工作,比如聚类、找同义词、词性分析等等。如果换个思路, 把词当做特征,那么Word2ve_gensim 语义相似度

java线程安全总结_java 自定义class 怎样保证线程安全-程序员宅基地

文章浏览阅读178次。原文: http://www.iteye.com/topic/806990http://www.iteye.com/topic/808550最近想将java基础的一些东西都整理整理,写下来,这是对知识的总结,也是一种乐趣。已经拟好了提纲,大概分为这几个主题: java线程安全,java垃圾收集,java并发包详细介绍,java profile和jvm性能调优 。慢慢写吧。本_java 自定义class 怎样保证线程安全

3.2多目标优化_四个目标的多目标优化-程序员宅基地

文章浏览阅读1.4k次。3.2多目标优化 最早提出多目标优化的是由Franklin在1772年提出了如何协调多目标矛盾的这一问题中,国际上认为多目标优化问题由P areto在1896年正式提出,他将多个在本质上不能对比的目标转变为一个单一的最优化目标[[39]。无论是在生活中还是在科研中,经常会遇到由多个相互影响或冲突的目标组成的问题。这是一种在一定区域内要求两个或及以上的目标都要求达到最佳的问题,也就是多目标优化问题(Multi-Obj ective Optimization Problem , MOP ) [.._四个目标的多目标优化

c# await的用法_c#await怎么用-程序员宅基地

文章浏览阅读1w次。Async、Await是net4.x新增的异步编程方式,其目的是为了简化异步程序编写1 await和async配对使用。最典型的应用如下:下面的代码是不用线程的情况,winform就会在5秒的无响应状态后才会在testbox中显示“test”,用户体验不好。​private string testString(){ Thread.Sleep(5000);..._c#await怎么用

Himi 原创 详解iOS应用程序内使用IAP/StoreKit付费、沙盒(SandBox)测试、创建测试账号流程!...-程序员宅基地

文章浏览阅读157次。Himi 原创, 欢迎转载,转载请在明显处注明! 谢谢。 原文地址:http://blog.csdn.net/xiaominghimi/article/details/6937097 终于在11月公司的游戏即将上线了,那么对于iOS游戏来说当今都是内置道具收费属于主流,那么我们的游戏也是内置收费,所以Himi这里分享给大家关..._himi密码

Microsoft Windows CE 5.0 Board Support Package, Boot Loader, and Kernel Startup Sequence_microsoft windows ce bios bootloaderversion 2.2 (b-程序员宅基地

文章浏览阅读1.2k次。Learn about the initial, low-level startup sequence and the hardware platform functions that are performed when the boot loader and OEM abstraction layer (OAL) are developed and the kernel is run. The startup sequence is an integral part of developing the _microsoft windows ce bios bootloaderversion 2.2 (built nov 22 2016)

随便推点

mysql 创建表遇到单列的长度限制 ERROR 1074 (42000) 与 行长限制 ERROR 1118 (42000)_result: 1074 - column length too big for column ''-程序员宅基地

文章浏览阅读2.5k次。os: centos 7.4db: mysql 8.0.18ERROR 1074 (42000): Column length too big for column ‘c0’ (max = 16383); use BLOB or TEXT insteadERROR 1118 (42000): Row size too large. The maximum row size for the u..._result: 1074 - column length too big for column '' (max = 16383); use blob o

EDIUS抠图的方法-程序员宅基地

文章浏览阅读412次。有时候我们把素材图片导入到EDIUS中会发现图片的背景有点不合适,这时候就会想替换掉这个背景。那么EDIUS也可以像PS一样替换掉背景吗?答案当然是肯定的,现在小编就带领你们一起来学习EDIUS抠图吧! 1、如下图,我们们把它导入到EDIUS中: 2、然后我们打开特效面板在视频滤镜里面..._edius里面抠图

静态路由简介_ip route-static-group-程序员宅基地

文章浏览阅读2.3k次。1静态路由1.1静态路由简介1.2配置静态路由1.3配置静态路由配置组1.4配置静态路由删除1.5配置静态路由与BFD联动1.5.1功能简介1.5.2配置控制报文方式的BFD检测1.5.3配置echo报文方式的BFD检测1.6配置静态路由快速重路由功能1.6.1功能简介1.6.2配置限制和指导1.6.3配置手工指定备份下一跳1.6.4配置自动查找备份下一跳1.6.5配置静态路由快速重路由支持BFD检测功能1.7静态..._ip route-static-group

awk实际应用:文本合并-程序员宅基地

文章浏览阅读157次。请使用awk命令将如下两份文件中名字相同的两行合并起来12345678910[root@localhost~]#cat1.txt韩海林21岁海林韩23岁韩林海22岁林海韩24岁[root@localhost~]#cat2.txt韩林海男海林韩男韩海林男林海韩男..._awk 把文本拼起来

sentinel运行原理详解_sentinel原理-程序员宅基地

文章浏览阅读6.6k次,点赞5次,收藏41次。本文基于sentinel-1.8.0版本DegradeSlot:服务降级AuthoritySlot:黑白名单校验,按照字符串匹配,比较简单ClusterBuilderSlot:构建ClusterNode对象,该对象为后面统计QPS、线程数、异常、响应时间等使用。SystemSlot:校验QPS、线程数、系统负载、CPU,按照窗口统计StatisticSlot:统计处理过的请求数和线程数FlowSlot:按照自定义的流控规则检查,这个与StatisticSlot相关NodeSelectorS._sentinel原理

安全多方计算中通用混淆电路估值技术_电路估值密码学-程序员宅基地

文章浏览阅读218次。总序广义上而言SMPC分为两种实现方式,一类是使用布尔电路表述待计算函数,然后使用通用混淆电路来实现安全多方计算。另一类是使用域上的算术电路表述待计算函数,然后使用密码学方法实现安全多方计算。Yao氏混淆电路估值方案该方案可以用于实现对任何类型的门电路的安全估值。Lindell和Pinkas对该方案进行了严格的安全论证,证明该方案在半诚实模型下是安全的。下面简介姚氏混淆电路估值方案。令$C..._电路估值密码学

推荐文章

热门文章

相关标签