js 调用window.print()方法打印
目的:打印功能实现,添加水印
步骤:
1.写好jsp页面
2.写打印方法
即window.print()打印当前页面,如果只想打印部分页面的话,可以截取该部分赋值给body即可
3.调用打印方法即可
遇到的问题:水印无法打印
刚开始将水印图片赋值给背景图片,即background-image。但是一直无法打印,网上搜了一些人的方案,都无法实现
1.第一个说勾选打印背景图片即可
结果无效。
2.第二个方法是说可能图片未加载出来即调用了打印方法,会导致无法打印出图片
验证方法:我将打印方法手动调用,打印方法改为全局打印(PS:害怕给body赋值的话导致需要重新加载图片),等确认好有图片的时候按下打印方法,结果无效
3.给样式添加@media
@media print{#Pay{background-image:url}} 同样无法打印图片
解决方法:既然无法打印,我就将图片放到img中,利用绝对定位将其放置在需要打印的div上
结果:实现了打印功能
备注:通往成功的路不止一条,该换的时候还是要换的。
jsp部分
<body>
<!--startprint--><div class="table" id="Pay" style="display:block"><div class="top">付款申请表</div><table border="0" cellspacing="0"><tr><td class="gray" colspan="4">应付款情况说明:${pay.notes }</td></tr><tr><td>合同名称</td><td>${pay.reason }</td><td>合同编号</td><td>${pay.projectNum }</td></tr><tr><td>合同总金额(元)</td><td><fmt:formatNumber type="number" value="${pay.money}" maxFractionDigits="2" pattern="#0.00"/>元</td><td>合同签署时间</td><td><fmt:formatDate value="${pay.projectDate}" type="both" pattern="yyyy-MM-dd"/></td></tr><tr><td>本次应付款金额</td><td><fmt:formatNumber type="number" value="${pay.payMoney}" maxFractionDigits="2" pattern="#0.00"/>元</td><td>本次最晚付款时间</td><td><fmt:formatDate value="${pay.lastTime}" type="both" pattern="yyyy-MM-dd"/></td></tr><tr><td>申请人</td><td>${pay.createBy.name}</td><td>申请日期</td><td><fmt:formatDate value="${pay.createDate}" type="both" pattern="yyyy-MM-dd"/></td></tr><tr><td class="gray">审批人职位</td><td class="gray">审批人</td><td class="gray">审批时间</td><td class="gray">审批意见</td></tr><c:forEach items="${historyList}" var="hlist"><tr><td>${hlist.name}</td><td>${hlist.assignee}</td><td>${fn:substring(hlist.endTime,0,19)}</td><td>${hlist.message}</td></tr></c:forEach></table><div id="img"><img alt="" src="${ctxStatic}/images/oa/mark.png"></div></div>
<!--endprint--> <button onclick="dayin()">打 印</button>
</body>
js部分
<script type="text/javascript">
$(document).ready(function() {dayin();
});
function dayin(){bdhtml=window.document.body.innerHTML;//获取当前页的html代码 sprnstr="<!--startprint-->";//设置打印开始区域 eprnstr="<!--endprint-->";//设置打印结束区域 prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取html prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html window.document.body.innerHTML=prnhtml; window.print();
}
</script>
打印效果
js 调用window.print()方法打印相关推荐
- ie调用window.print批量打印数据表格。
需求 根据勾选的checkbox,一次将数据打印出来. 注意 1,我第一次是用循环一次一次调用window.print方法,想把数据一张一张打出来.结果因为输入输出流的问题,这样是一个死路. 取巧的思 ...
- js使用window.print()实现打印功能
js使用window.print()来实现打印功能 1.首先在需要打印的内容标签上面绑定ref <div ref="tableRef">需要打印的内容 </div ...
- 使用 Window print() 方法 实现打印文件
前言:今天得到一个需求 就是把一些wode文档中的表格,去根据数据填充,然后调用打印机进行打印出来 在这个需求下来的时候,其实第一时间就想的是,使用JAVA代码对wode文档进行操作,然后调用打印机去 ...
- js的window.print()打印背景图片,打印背景图片无法显示
js的window.print()打印背景图片 题目描述 js的window,print()打印背景图片给body加了图片地址之后,非要设置浏览器打印选项里面设置背景图形打印才行,怎么通过js去设置默 ...
- 使用window.print()方法分页打印
使用window.print()方法分页打印 只需要在每页中增加以下样式属性 style="page-break-after:always" 例如 <div style=&q ...
- window.print()方法实现打印功能,多出一张空白页
项目内需要实现一个打印的功能,用了window.print()方法,但是在打印的时候总是多出一张空白页,偶然搜到了一篇文章,(https://blog.csdn.net/web_houzhanguo/ ...
- Html调用窗口,等待HTML调用window.print()之前写窗口
我有这样的尝试是把一些内容到一个弹出窗口,然后JavaScript代码连接到打印:等待HTML调用window.print()之前写窗口 $(".print_friendly_popup&q ...
- 浏览器打印 之 window.print() 设置打印样式和内容
项目中用的是谷歌浏览器,js 执行 window.print() 就会调用谷歌浏览器的打印功能. 打印其实打印的是整个当前网页,只是用媒体查询(@media print)把网页中要打印的内容做了显示, ...
- JS调用window系统通知
JS调用window.Notification() 在写一个应用的时候需要显示网页来的消息,为了让用户不会错过消息,所以希望使用JS调用win10的通知消息,调用方法如下: 在页面打开的时候查看浏览器 ...
最新文章
- 斯坦福大学深度学习与自然语言处理第一讲:引言
- 淘宝NPM镜像、cnmp
- 什么是JNDI,SPI,CCI,LDAP和JCA?
- php预处理_如何用预处理让 PHP 更先进
- php切割文件上传,php+ajax实现文件切割上传功能示例
- python自动化之djangoform表单验证
- c语言 结构体的输入输出_C语言的控制结构和输入输出
- 在windows server 2003服务器上提供NTP时间同步服务
- nj04---事件回调函数
- pix4d空三导入cc_CC(Context Capture)软件安装及空三过程中的十大常见报错与解决方法...
- 人工智能在生活中的应用都有哪些?
- 不出门也能拍好证件照
- 基于PyQt5与opencv制作的证件照尺寸变换应用程序
- 计算机c盘无法扩展,电脑c盘怎么扩大_C盘空间不足的扩大步骤-win7之家
- linux 下安装rar解压软件,centos下rar解压工具的安装 rar和unrar命令使用方法
- 陈松送:22个免费发布视频的平台
- Vue 的属性、方法和生命周期
- GPS 双频/单频接收机介绍
- 中国做SaaS为什么这么难?
- linux qt fscanf,fscanf QT小部件C++