写了有关于web客户端打印物料条码的功能。想着以后可能会用到,就把他给写下来了。

主要参考了:https://blog.csdn.net/ww130929/article/details/71977187

https://www.jb51.net/article/117782.htm

功能描述:

打印可以给工厂使用的标签,用来扫描物料条码。里面除了包括物料信息(数量,编码,生产订单号等)外还有就是条形码跟加工图。并且要能够同时打印多张条码。这个功能之前是用java做的,但是后来发现java只能实现服务器端打印,实际上这个功能要满足客户端打印,连接的是客户端的打印机,所以就去找了一些web打印的例子。用的是window.print()这个方法。

知识点记录:

window.print()是调用浏览器本身的打印功能,打印的是当前页面的信息,所以打印之前需要重写当前页面的内容:用window.document.body.innerHTML。

批量打印根据打印分页,使用

分页功能给需要打印的内容分页。

图片加载:可以直接用img的src获取后台图片信息。需要注意的是,页面加载比访问数据来的快,如果图片是动态加载的话,可以设置setTimeout(function(){ window.print();  },500);来延迟打印功能,先让图片加载完。

代码:

打印的表格直接写在一个隐藏的(style="visibility:hidden; ")的div里面,后面可以根据jquery的$("#printDetailDiv").prop("outerHTML")或则document.getElementById("###").outerHTML;来获取整个div里面的信息,比较直观也可以减少重写当前页面的时候字符串的拼接。

物料编码

规格

生产订单号

数量

研发编码

BOM明细编号

2 用JS拼接需要批量打印的内容。

function creatTB(checkMsg){

var printHtml = "";

for(i=0;i");

$("#img2").html("

");

printHtml = printHtml + $("#printDetailDiv").prop("outerHTML");

printHtml = printHtml + "

";

}

return printHtml;

}

3 调用打印功能。后面的location.reload()是放回之前的页面,

var printHtml = "";

printHtml = creatTB(checkMsg);

window.document.body.innerHTML=printHtml;//需要打印的页面

setTimeout(function(){

window.print();

location.reload();

},500);

html 多个分页连续打印机,web使用window.print()实现分页批量打印。相关推荐

  1. web使用window.print()实现分页批量打印。

    写了有关于web客户端打印物料条码的功能.想着以后可能会用到,就把他给写下来了. 主要参考了:https://blog.csdn.net/ww130929/article/details/719771 ...

  2. 使用window.print()方法分页打印

    使用window.print()方法分页打印 只需要在每页中增加以下样式属性 style="page-break-after:always" 例如 <div style=&q ...

  3. html - table分页断行,关于window.print网页分页换页table不断行的处理

    在打印的时候,如果数据多,div又是一整个,table过长,就会导致断行出现,这个要怎么改呢. .avoidBreak { border: 2px solid; page-break-inside:a ...

  4. window.print() 表格打印 完美实现分页

    问题描述: 采用js打印页面,表格过长 会出现分页,表格就会被裁减(那种每行固定就一行展示的简单,每个分页给他多少条数据就完事了),这里的问题是数据从后台获取,而且每一列都可能出现换行,多的可能达到1 ...

  5. window.print()实现分页打印

    第一种方法:字符串拼接的方式 表头在style中填写样式 var printStr = "<html><head><meta http-equiv='Conte ...

  6. js 页面打印,兼容单个打印和分页批量打印,自定义页眉和简单页脚

    场景: 最近在公司做开发,有个需求需要页面打印功能,作为前端半桶水都不到,只会改页面的我,一脸懵逼,公司里也没人系统的做过,按照惯例,本着有事找度娘的心态(我一直认为我们现在遇到的70%-80%的问题 ...

  7. web打印window.print

    这几天一直在研究通过web程序打印条形码到标签上,由于打印机和显示器不同,碰到了各种坑,现一一列出来,给各位参考. web打印有很多的方式,比如生成pdf打印.JQuery插件.window.prin ...

  8. 批量打印html文档,web页面的单页打印以及批量打印实现方法

    打印事件:window.print() 1.单页打印(布局打印): function printCnt(){ //1.获取当前页的html代码 var body = window.document.b ...

  9. html批量打印,web页面的单页打印以及批量打印实现方法

    打印事件:window.print() 1.单页打印(布局打印): function printCnt(){ //1.获取当前页的html代码 var body = window.document.b ...

最新文章

  1. 揭秘PHP深受Web开发者喜爱的原因
  2. 计算机应用基础 黄国兴 研读,《计算机应用基础》大纲解读黄国兴
  3. python软件开发文档目录_python学习之-软件开发的目录规范
  4. vim 插件_你不得不知道的适用于程序员的VIM插件
  5. 数据倾斜?几招把你安排的板板正正的!
  6. vmware安装渗透系统 Linux Kail最新版
  7. angularjs directive scope变化为啥html,学习AngularJs:Directive指令用法(完整版)
  8. qxdm无法安装问题闪一下_win10系统显示“出现了问题,无法安装功能”解决办法...
  9. Python对象序列化-Pickle模块
  10. 引用数据类型Scanner,Random
  11. 排序算法之四 归并排序(C++版本)
  12. 华为工作法--读后感
  13. html怎么创建表格,html怎么做表格
  14. kindle中html笔记,大神教你用Kindle做笔记,事半功倍的方法来了!
  15. C# 调试应用提示“无法访问此网站”问题的处理(图文)
  16. Linux连接荣耀路由器pro2,荣耀路由器Pro2与路由存储、远程访问、家庭共享
  17. Graham扫描法求解凸包问题(C++)
  18. windows上安装Robot Framework和RIDE
  19. 孙溟㠭书画《野狐禅》
  20. Spring春风拂面系列---SpringBoot 设置response header的方法总结

热门文章

  1. 外协采购订单组件的“报废率”问题
  2. 南昌航空大学 c语言,南昌航空大学C语言末考试试卷.doc
  3. 联想小新,蓝牙突然不能用了解决办法!
  4. 浅析计算机用户身份识别技术,一种计算机系统及其用户的身份识别方法和系统与流程...
  5. PAT——1114 全素日
  6. 迟到的web2.0...
  7. 良心安利SolidEdge 3d模型素材
  8. AI Studio精选项目 | 儿童X光胸部肺炎诊断,用飞桨四步搞定
  9. 沪深300首批样本股名录
  10. 在移动设备上使用豆瓣FM Pro