lodop使用

最新推荐文章于 2024-04-02 16:27:43 发布
最新推荐文章于 2024-04-02 16:27:43 发布
阅读量2.6w 收藏 7
点赞数
分类专栏： 打印
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u014236541/article/details/50536616
版权

根据相应的操作系统，安装install_lodop32.exe文件，它里面包含两个exe文件install_lodop32.exe和install_lodop64.exe，在页面的头部中引入:

  1. <!--打印插件-->
  2. <scripttype="text/javascript"src="<%=basePath%>js/LodopFuncs.js"></script>
  3. <objectid="LODOP_OB"classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA"width=0height=0>
  4. <embedid="LODOP_EM"type="application/x-print-lodop"width=0height=0></embed>
  5. </object>
  6. <!--打印end-->

当我们在执行操作的时候，它会根据相应的操作系统(32位or64位)，选择相应的exe文件，下载安装，这个安装文件比较小，所以安装起来也比较方便。卸载它也很简单，只要复制这个exe文件，然后改名为：uninstall_lodop32.exe，点击运行即可,安装后我们就可以使用里面的JS函数了：

 
● PRINT_INIT(strPrintTaskName)打印初始化
● SET_PRINT_PAGESIZE(intOrient,intPageWidth,intPageHeight,strPageName)设定纸张大小
● ADD_PRINT_HTM(intTop,intLeft,intWidth,intHeight,strHtml)增加超文本项
● ADD_PRINT_TEXT(intTop,intLeft,intWidth,intHeight,strContent)增加纯文本项
● ADD_PRINT_TABLE(intTop,intLeft,intWidth,intHeight,strHtml)增加表格项
● ADD_PRINT_SHAPE(intShapeType,intTop,intLeft,intWidth,intHeight,intLineStyle,intLineWidth,intColor)画图形
● SET_PRINT_STYLE(strStyleName, varStyleValue)设置对象风格
● PREVIEW打印预览
● PRINT直接打印
● PRINT_SETUP打印维护
● PRINT_DESIGN打印设计
最基本的打印过程至少有初始化语句、添内容语句和打印语句三部分组成，例如：
LODOP.PRINT_INIT("打印任务名");//首先一个初始化语句
LODOP.ADD_PRINT_TEXT(0,0,100,20,"文本内容一");//然后多个ADD语句及SET语句
LODOP.PRINT();//最后一个打印(或预览、维护、设计)语句

结合各种函数，输出用户需要的结果：这里我使用的是我的案例，项目中由于文件内容比较长，也比较宽，所以我需要横向打印，并且需要打印很多页，每页都要有固定标题和页脚，例如第1页/共3页，代码如下：

  1. varLODOP;//声明为全局变量
  2. functionpreview(){
  3. CreatePrintPage();
  4. //打印预览
  5. LODOP.PREVIEW();
  6. }
  7.  
  8. functionsetup(){
  9. CreatePrintPage();
  10. //LODOP.PRINT_SETUP();
  11. LODOP.PRINT_DESIGN();//打印设置
  12. }
  13.  
  14. functionprint(){
  15. CreatePrintPage();
  16. LODOP.PRINT();//打印
  17. }
  18.  
  19. //初始化页面
  20. functionCreatePrintPage(){
  21. //得到LODOP对象，注意head标签里面需引入object和embed标签
  22. LODOP=getLodop(document.getElementById('LODOP_OB'),document.getElementById('LODOP_EM'));
  23. //封装我们的html元素
  24. varstrBodyStyle="<style>table,td{border:1solid#000000;border-collapse:collapse}</style>";
  1. //获得id为content标签里面的html元素
  2. varstrFormHtml=strBodyStyle+"<body>"+document.getElementById("content").innerHTML+"</body>";
  3. //打印初始化，页面距离顶部10px，距离左边10px，宽754px，高453px，给打印设置个标题
  4. LODOP.PRINT_INITA(10,10,754,453,"打印控件操作");
  5. //设置打印页面属性：2：表示横向打印，0：定义纸张宽度，为0表示无效设置，A4：设置纸张为A4
  6. LODOP.SET_PRINT_PAGESIZE(2,0,0,"A4");
  7. //设置文本，参数(距离页面头部，距离页面左边距离，文本宽度，文本高度，文本内容)
  8. LODOP.ADD_PRINT_TEXT(21,300,300,30,"${unitType}${flowval}检修记录n");
  9. //给所添加的文本定义样式,0：表示新添加的元素，相应的属性，相应的值
  10. LODOP.SET_PRINT_STYLEA(0,"FontSize",15);
  11. LODOP.SET_PRINT_STYLEA(0,"ItemType",1);//固定标题,设置卫页眉页脚
  12. LODOP.SET_PRINT_STYLEA(0,"Horient",2);
  13. LODOP.SET_PRINT_STYLEA(0,"Bold",1);
  14. //同上
  15. LODOP.ADD_PRINT_TEXT(40,60,350,30,"机车号:${datePlan.jcType}${datePlan.jcnum}修程:${datePlan.fixFreque}检修日期:${datePlan.kcsj}");
  16. LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
  17. //添加html元素
  18. LODOP.ADD_PRINT_HTM(63,38,684,330,strFormHtml);
  19. LODOP.SET_PRINT_STYLEA(0,"FontSize",15);
  20. LODOP.SET_PRINT_STYLEA(0,"ItemType",4);
  21. LODOP.SET_PRINT_STYLEA(0,"Horient",3);
  22. LODOP.SET_PRINT_STYLEA(0,"Vorient",3);
  23. //添加一条线，参数(开始短点距离头部距离，开始端点距左边距离，结束端点距头部距离，结束端点距左边距离)
  24. LODOP.ADD_PRINT_LINE(53,23,52,725,0,1);
  25. LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
  26. LODOP.SET_PRINT_STYLEA(0,"Horient",3);
  27. LODOP.ADD_PRINT_LINE(414,23,413,725,0,1);
  28. LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
  29. LODOP.SET_PRINT_STYLEA(0,"Horient",3);
  30. LODOP.SET_PRINT_STYLEA(0,"Vorient",1);
  31. //LODOP.ADD_PRINT_TEXT(421,37,144,22,"左下脚的文本小标题");
  32. //LODOP.SET_PRINT_STYLEA(0,"Vorient",1);
  33. LODOP.ADD_PRINT_TEXT(421,542,165,22,"第#页/共&页");
  34. LODOP.SET_PRINT_STYLEA(0,"ItemType",2);
  35. LODOP.SET_PRINT_STYLEA(0,"Horient",1);
  36. LODOP.SET_PRINT_STYLEA(0,"Vorient",1);
  37. }

上面的函数都是自己通过学习它的API联合起来用的，我的注释可能会有些看不懂，希望大家能把API下载下来进行研究，其中它实现了很多功能哦！

1、画一个名片大小的矩形边框：
LODOP.ADD_PRINT_RECT(10,55,360,220,0,1);
边框离纸张顶端10px(px是绝对值长度，等于1/96英寸,下同)距左边55px、宽360px、高220px、
框为实线(0-实线 1-破折线 2-点线 3-点划线 4-双点划线)、线宽为1px
 
2、设置基本打印风格：
LODOP.SET_PRINT_STYLE("FontSize",11);
"FontSize"是系统关键字，表示设置字体大小，11是字体大小值，单位是pt。
 
3、在矩形框内打印姓名栏：
LODOP.ADD_PRINT_TEXT(20,180,100,25,"郭德强");
姓名栏离纸张顶端20px、距左边180px、宽100px、高25px、内容为“郭德强”
 
4、设置姓名栏的打印风格：
LODOP.SET_PRINT_STYLEA(2,"FontName","隶书");
LODOP.SET_PRINT_STYLEA(2,"FontSize",15);
2是姓名栏的增加顺序号,"FontName"和"FontSize"是系统关键字,表示设置字体名和字体大小。
"隶书"是字体名值,同操作系统的字体名，15是字体大小值，单位是pt。
序号设0表示最新对象，注意SET_PRINT_STYLEA与SET_PRINT_STYLE的区别。
 
5、下面打印其职务、地址、电话等(用基本风格)：
LODOP.ADD_PRINT_TEXT(53,187,75,20,"科学家");
LODOP.ADD_PRINT_TEXT(100,131,272,20,"地址：中国北京社会科学院附近东大街西胡同");
LODOP.ADD_PRINT_TEXT(138,132,166,20,"电话：010-88811888");
 
6、在发送以上指令前，一般要初始化并设置打印任务名：
LODOP.PRINT_INIT("打印插件功能演示_代码功能_名片");
初始化并指定打印任务名是"打印插件功能演示_代码功能_名片"

利用Lodop实现将页面表格元素导出为excel：

  1. functionSaveAsFile(){
  2. //得到LODOP对象
  3. varLODOP=getLodop(document.getElementById('LODOP_OB'),document.getElementById('LODOP_EM'));
  4. LODOP.PRINT_INIT("");//初始化，因为不需要打印，所以不需要为其设置标题
  5. //增加打印表格,（距离头部距离、距离左边、宽度、高度），得到相应表格中的html元素
  6. LODOP.ADD_PRINT_TABLE(100,20,500,80,document.getElementById("content").innerHTML);
  7. //设置相应模式
  8. LODOP.SET_SAVE_MODE("Orientation",1);//Excel文件的页面设置：横向打印1-纵向,2-横向;
  9. LODOP.SET_SAVE_MODE("LINESTYLE",1);//导出后的Excel是否有边框
  10. LODOP.SET_SAVE_MODE("CAPTION","行安检修记录");//标题栏文本内容
  11. //LODOP.SET_SAVE_MODE("CENTERHEADER","行安检修记录");//页眉内容
  12. //LODOP.SET_SAVE_MODE("PaperSize",9);//Excel文件的页面设置：纸张大小9-对应A4
  13. //LODOP.SET_SAVE_MODE("Zoom",90);//Excel文件的页面设置：缩放比例
  14. //LODOP.SET_SAVE_MODE("CenterHorizontally",true);//Excel文件的页面设置：页面水平居中
  15. //LODOP.SET_SAVE_MODE("CenterVertically",true);//Excel文件的页面设置：页面垂直居中
  16. //LODOP.SET_SAVE_MODE("QUICK_SAVE",true);//快速生成（无表格样式,数据量较大时或许用到）
  17. //保存文件，以窗口弹出对话框的方式，让用户去选择文件保存的位置，参数为文件保存的默认名称
  18. LODOP.SAVE_TO_FILE("${datePlan.jcType}-${datePlan.jcnum}-${unitType}检修记录.xls");
  19. };

这里本人所列出来的两个demo只是本人在项目中所用的，对其综合应用了，其实它里面有很多方法可以供我们去操作，实现各种各样的功能，我们只需要设置其中的参数，给打印页面各个元素定好位置，距离头部距离、距离左边距离、垂直或者水平摆放、居左还是居中对齐等等，我们都可以在里面进行相应的设置，自己把各个元素定位好，我相信它肯定能实现我们打印时所想要的效果！！

俗话说，说一百遍看一万遍，不如自己来写一遍，大家尝试着去研究一下吧！！

朱智文
关注
  • 0
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
lodop使用手册11111111111111111
03-13
lodop开源使用手册，里面有详细的接口使用介绍以及购买权限说明
LODOP.ADD_PRINT_TEXT 参数解释说明
lmy_loveF的博客
08-05 6051
LODOP.ADD_PRINT_TEXT 参数解释说明
使用lodop打印插件经验
weixin_48817925的博客
04-02 155
使用LODOP.ADD_PRINT_TEXT(495,204,519,83,"${ofDeptReason}");会出现未满行就换行的现象（字母，或者数值）
lodop导出ExcelDemo
02-19
lodop导出ExcelDemo
使用lodop进行html打印
02-28
使用lodop进行html打印，该资源包含了对应的JS和使用方式
Lodop技术文档使用
05-18
Lodop技术文档
Lodop打印相关
tao111369的博客
08-23 1912
本文只对遇到的一些特殊问题进行了总结，关于lodop的属性和方法详解可查看求知路漫漫的博客或者Lodop、C-Lodop使用说明及样例 图片像素尺寸转换 1.打印表格的方式有两种，函数如下： ADD_PRINT_TABLE(intTop,intLeft,intWidth,intheight,strHTML);用超文本打印ADD_PRINT_TBURL(intTop,intLeft,intWi...
LODOP.PRINT 打印方法||Lodop打印设计（PRINT_DESIGN）介绍
ll_883963的博客
04-29 4323
这里写目录标题文本矩形线条表格 文本 LODOP.ADD_PRINT_TEXT(85,391,75,20,“文本内容”); //打印项的位置，参数一般为top（顶边距）,left（左边距）,width（宽度）,height(高度） LODOP.SET_PRINT_STYLE(“FontSize”,11);//整体设置（针对文本项），打印初始化后、增加打印项之前调用本函数 LODOP.SET_PRINT_STYLEA(0,“Alignment”,2); //给前面第一个文本（序号0为前面紧跟着的元素，这里是
使用Lodop控件打印表单和二维码
热门推荐
weixin_45111741的博客
12-16 1万+
1.了解lodop 1.1Lodop的定义 Lodop(标音:劳道谱,俗称:露肚皮)是专业WEB控件,用它既可裁剪输出页面内容，又可用程序代码直接实现复杂打印。控件功能强大,却简单易用,所有调用如同JavaScript扩展语句一样。 1.2Lodop的下载 下载链接：http://www.lodop.net/download.html 一路安装就行，安装好之后解压 可以跟着示例一个一个学习，不懂的地方结合源代码一起学习 2.在页面中引入lodop (必须要安装lodop才行，不然没有效果) 在页面中嵌入l
VUE 集成 LODOP插件打印
梅廷贺的博客
04-15 2110
VUE 中使用 LODOP插件打印VUE 中使用 LODOP插件打印Lodop、C-Lodop使用说明及样例VUE简单使用lodop1.创建LodopFuncs.js文件2.在打印功能vue页面引入LodopFuncs3.执行打印方法4.打印接口函数官网样例说明 VUE 中使用 LODOP插件打印 Lodop、C-Lodop使用说明及样例 http://www.lodop.net/LodopDemo.html VUE简单使用lodop 1.创建LodopFuncs.js文件 js 内容如下 var Cre
Lodop print
09-13
Lodop是一款专业的WEB打印控件，其设计目标是简单易用、功能足够强大，目前Lodop支持IE系列、IE内核系列(遨游、360、世界之窗、腾讯TT、搜狗等)浏览器，以及Firefox(火狐)系列、Chrome(谷歌)系列、Opera系列、Safari系列等Windows下几乎所有的浏览器。
使用lodop使用JSP套打打印
08-20
自己总结的套打实现方式，内有源码可以参考，还有比较详细的技术论坛地址
Vue使用lodop实现打印小结
10-16
主要介绍了Vue使用lodop打印小结，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
IEC 60364-7-722-2018 低压电气装置.第7-722部分：特殊装置或场所的要求.电动车辆的电源.pdf
05-06
IEC 60364-7-722-2018 低压电气装置.第7-722部分：特殊装置或场所的要求.电动车辆的电源.pdf
eNSP软件安装及拓扑结构搭建.docx
05-06
、eNSP的安装 1．安装eNSP之前必须先安装以下三个插件： VirtualBox WinPcap Wireshack eNSP作为模拟器主体，需要对应版本的VirtualBox和WinPcap提供虚拟环境，Wireshack用于实验当中测试抓取数据包使用。 安装好这三个插件，只需要点下一步选择好对应的安装位置即可，然后就可以安装eNSP软件了。 eNSP的页面
vmware虚拟机安装教程
05-06
附件是vmware虚拟机安装教程，文件绿色安全，请大家放心下载，仅供交流学习使用，无任何商业目的！
大屏网站粒子效果实现方式
05-06
大屏网站粒子效果实现方式
node-v8.11.3-sunos-x86.tar.xz
最新发布
05-06
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
vue使用 lodop 打印小票
01-20
Vue.js 是一个流行的前端框架，而 LOdop 是一个强大的打印插件，用于在浏览器中打印各种类型的文档和小票。 在 Vue 中使用 LODOP 打印小票可以通过以下步骤实现： 首先，需要在项目中引入 LODOP 打印插件的相关文件，可以通过 npm 安装 LODOP 打印插件，并在 Vue 项目的入口文件中引入 LODOP 打印插件。 然后，创建一个打印小票的组件，在组件中通过 LODOP 的 API 方法来设置小票的内容和样式。 接下来，可以在需要打印小票的地方调用 LODOP 的打印方法，将准备好的小票内容传入，即可实现通过 LODOP 在浏览器中打印小票。 此外，还可以通过 LODOP 提供的模板功能来设计小票的模板，使得小票的样式更加灵活和个性化。 总的来说，Vue 中使用 LODOP 打印小票是一个相对简单而且效果非常不错的方案，可以帮助开发者实现在浏览器中快速、方便地打印各种类型的小票和文档。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值