首页 > 代码库 > lodop页面直接打印 水印 分页 套打

lodop页面直接打印 水印 分页 套打

2024-07-17 21:49:13   221人阅读

用lodop实现打印出并带水印和表格分页每页都显示表头功能。

1、什么是lodop

lodop取意自“load or print”，是一款优秀的Web打印控件,在开发中，传统打印控件总是“页面是什么就只能打印什么”，缺乏灵活性，使打印略显呆板。而使用lodop则可以做到“只看想看的、打印想打的”，不仅开发人员可以自由设置打印输出内容，用户还可对打印内容进行一系列调整。
1、lodop控件目前有简体中文、繁体中文、大五码(big5)和英文几个版本。
2、适用于IE系列浏览器、Firefox系列浏览器和IE内核浏览器(遨游、360、世界之窗、腾讯TT、搜狗等)等各类浏览器。
3、使用lodop作为WEB打印控件的优势：
(1)使用简单，易上手，引入LodopFuncs.js文件通过几个函数的调用就可以实现一项复杂打印任务的开发,极大地减少了打印功能开发量。
(2)网页中的任何内容都是打印输出时的裁减素材，使用JS语句将当前网页中某区域超文本显示在既定打印布局中输出，其在打印布局中的位置既可程序控制，也可由使用者在操作时调整。
(3)各类调整和打印设置等控制内容全部本地自动保存，彻底解决了一个大型软件工程项目中打印机类型繁杂时的精确套打问题。
(4)使用插件技术来实现WEB打印，插件安装方式不仅简单，而且成功率高。
(5)支持样式调整可以把页面显示在打印时调整样式使打印出来另一种效果。

1、下载lodop的demo和文档

从官网下载lodop解压后发现除了两个exe文件一个js文件其他的就是demo文件了。
(1)js文件是不可少的必须引入。
(2)在页面head之间加入发下代码：
<object id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0> 
	<embed id="LODOP_EM" type="application/x-print-lodop" width=0 height=0></embed>
</object>
(3)打开LodopFuncs.js修改客户端exe文件路径,主要是href=http://www.mamicode.com/‘install_lodop32.exe‘和href=‘install_lodop64.exe‘路径（lodop会根据浏览器是32或者64选用对应的安装文件）
(4)调用函数实现打印功能。直接看demo43实现了分页的功能。
function PreviewMytable(){
		var LODOP=getLodop();  
		LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_分页打印综合表格");
		var strStyle="<style> table,td,th {border-width: 1px;border-style: solid;border-collapse: collapse}</style>"
		LODOP.ADD_PRINT_TABLE(128,"5%","90%",314,strStyle+document.getElementById("div2").innerHTML);
		LODOP.SET_PRINT_STYLEA(0,"Vorient",3);		
		LODOP.ADD_PRINT_HTM(26,"5%","90%",109,document.getElementById("div1").innerHTML);
		LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
		LODOP.SET_PRINT_STYLEA(0,"LinkedItem",1);	
	    	LODOP.ADD_PRINT_HTM(444,"5%","90%",54,document.getElementById("div3").innerHTML);
		LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
		LODOP.SET_PRINT_STYLEA(0,"LinkedItem",1);	
		LODOP.NewPageA();
    		LODOP.ADD_PRINT_TABLE(128,"5%","90%",328,strStyle+document.getElementById("div2").innerHTML);
		LODOP.SET_PRINT_STYLEA(0,"Vorient",3);	
		LODOP.ADD_PRINT_HTM(26,"5%","90%",80,document.getElementById("div4").innerHTML);
		LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
		LODOP.SET_PRINT_STYLEA(0,"LinkedItem",4);	
		LODOP.ADD_PRINT_TEXT(460,96,"76.25%",20,"真诚祝您好远，欢迎下次再来！(发货单02的表格外“页脚”，紧跟表格)");
		LODOP.SET_PRINT_STYLEA(0,"LinkedItem",4);
		LODOP.SET_PRINT_STYLEA(0,"FontSize",12);
		LODOP.SET_PRINT_STYLEA(0,"FontColor","#FF0000");
		LODOP.SET_PRINT_STYLEA(0,"Alignment",2);
		LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
		LODOP.SET_PRINT_STYLEA(0,"Horient",3);	
		LODOP.ADD_PRINT_HTM(1,600,300,100,"总页号：<font color='#0000ff' format='ChineseNum'><span tdata=http://www.mamicode.com/'pageNO'>第##页/共##页");>这里面的函数就不在解释lodop的文件说的非常详细。通过上面的代码就能实现表头固定和分页功能。而水印就比较简单了有两种方式：
(1)页面上设置背景这种方式最简单纯css。
(2)通过lodop函数设置位置来添加水印只需要加上如下代码
<span style="white-space:pre">	</span>LODOP. ADD_PRINT_SETUP_BKIMG("<img border='0' src=http://www.mamicode.com/'print_bg.gif' style='z-index: -1'/>");>


联系
我们