最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
html web打印小结
时间:2022-06-25 14:35:04 编辑:袖梨 来源:一聚教程网
项目中有个需求是将winform客户端的打印,移到网页上由客户自行打印,打印要求是根据一定的格式实现套打。
当时的解决方案是使用PDF打印:
1、 准备好套打格式的底图;
2、打开底图,将动态内容画到底图上;
3、利用第二步修改后的图片,生成PDF,完成打印
后来发现一款比较强大的web打印工具lodop,简单使用说明如下:
1、先检查下浏览器是否安装此插件:
http://www.lodop.net/demolist/PrintSample1.html
2、建立html,此入口可以打开一个图形化编辑页面,生成结果图如下:
代码如下 | 复制代码 |
function myPreview() { LODOP.PRINT_INIT("测试套打模板"); }; |
3、我们可以将要套打的单据做成图片,导入这个图形化界面作为背景图,然后放入文本框等内容,开始测试。
4、完成位置定位后,可以点击左上角的整体对准图标,做统一调整。
5、去掉背景图,生成代码,放入JS代码段中
代码如下 | 复制代码 |
LODOP.PRINT_INIT("测试套打模板"); LODOP.ADD_PRINT_TEXT(107,225,338,30,"竞买人名称"); LODOP.SET_PRINT_STYLEA(0,"FontSize",15); LODOP.ADD_PRINT_TEXT(421,116,209,26,"手机号码"); LODOP.SET_PRINT_STYLEA(0,"FontSize",13); function myPreview() { LODOP.PRINT_INIT("测试套打模板"); LODOP.ADD_PRINT_TEXT(107,225,338,30,"竞买人名称"); LODOP.SET_PRINT_STYLEA(0,"FontSize",15); LODOP.ADD_PRINT_TEXT(421,116,209,26,"手机号码"); LODOP.SET_PRINT_STYLEA(0,"FontSize",13); }; |
6、JS参数性质的改动
总结:
PDF的难点在于要精确的计算出需要填充内容的位置,调试比较麻烦,而lodop是图形化界面,方便我们调试,并且语法简单,方便溶于JS中,此处仅仅简单列举了一个简单的实例,更多功能,可参考官网地址:http://www.lodop.net
相关文章
- 云星穹铁道权益升级怎么玩 云崩铁权益升级活动介绍 12-03
- 以闪亮之名山中绘梦怎么玩 以闪亮之名滢然花梦套装活动介绍 12-03
- 以闪亮之名绿野梦歌礼包怎么样 以闪亮之名绿野梦歌拍照礼包介绍 12-03
- 光遇12.6有什么更新 光遇12月6日更新内容介绍 12-03
- 伍六七暗影交锋测试资格怎么获得 伍六七暗影交锋内测资格获取方法 12-03
- 无限暖暖晶莹诗集怎么样 12-03