LODOP中带caption的表格被关联并次页偏移测试
ADD_PRINT_TABLE中的thead和tfoot可以每页输出,后面的打印项关联表格,可以紧跟着表格,实现在表格后面紧跟着输出内容的效果,表格可以自动分页,并总是跟在表格后面 ,在表格最后输出。table相关博文:LODOP表格table简短问答及相关博文、
例如,在table后面紧跟着输出一段htm超文本内容,由于表格是不固定的,有时候表格内容多有时候少,可能有时候正好在最后一页,后面的htm超文本盛放不开,也需要自动分页了。
表格中由于第一页有标题,常用到次页偏移,让除第一页后的表格能提上去,避免后面的自动分页上方空白。
如果有table中有caption,注意该caption也是表格内部的高度,次页偏如果想很靠上,也会把caption的距离偏移上,但是其实caption是表格打印项的高度,而后面的htm由于关联前面的表格,形成关联串,也会跟着前面的table的偏移距离进行偏移,但是后面的htm是没有caption的,所以就会导致htm偏移出纸张外的情况。
解决方法:
建议把caption放到外面,caption单独做成打印项,或者和前面的标题打印项等做成一个超文本打印项,不要放在自动分页并进行次页偏移的table打印项里面。
(如果最后的htm不是刚好最后页不够,进行自动分页,是不会有影响的,但是如果刚好遇到最后跟着的html进行自动分页,而且需要偏移到紧靠纸张上方,带着caption就会有影响,因此去掉caption是很好的方法。)
关于html代码的排查和定位到和什么有关,可以通过做简单例子排查和什么有关,很多开发人员的内容很多,带有很多样式等,一眼看上去很难发现和什么有关,可以通过做简单例子或删减进行排查,否则此问题很可能会被误认为和偏移或关联有关,通过做简单例子我测试发现简单例子都是正常的,然后通过偏移值调整发现距离的差异,然后又逐步排查和简单例子不同的地方,找到了这个capiton导致的偏移高度。
测试代码:
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>WEB打印控件LODOP</title> <script language="javascript" src="LodopFuncs.js"></script> </head> <body> <div id="p"> <table border=1 style="border-collapse:collapse;" width="150cm"> <caption>表格的标题</caption><!--多余的高度--> <thead> <tr> <td height="5cm">A1head</td> <td height="5cm">A2head</td> </tr> </thead> <tr> <td height="150cm">B1</td> <td height="150cm">B2</td> </tr> <tr> <td height="150cm">C1</td> <td height="150cm">C2</td> </tr> <tr> <td height="15cm">D1</td> <td height="15cm">D2</td> </tr> <tfoot> <tr> <td height="5cm">E1foot</td> <td height="5cm">E2foot</td> </tfoot> </tr> </table> </div> <div id="p2"> <table border=1 style="border-collapse:collapse;" width="150cm"> <thead> <tr> <td height="5cm">A1head</td> <td height="5cm">A2head</td> </tr> </thead> <tr> <td height="150cm">B1</td> <td height="150cm">B2</td> </tr> <tr> <td height="150cm">C1</td> <td height="150cm">C2</td> </tr> <tr> <td height="15cm">D1</td> <td height="15cm">D2</td> </tr> <tfoot> <tr> <td height="5cm">E1foot</td> <td height="5cm">E2foot</td> </tfoot> </tr> </table> </div> <div id="last"> <table border=1 style="border-collapse:collapse;"> <tr> <td>最后11</td> <td>最后11</td> </tr> <tr> <td>最后22</td> <td>最后22</td> </tr> <tr> <td>最后33</td> <td>最后33</td> </tr> </table> </div> <a href="javascript:prn0_preview()">测试紧跟关联表格后面的htm自动分页(带caption)</a><br> <a href="javascript:prn01_preview()">加大偏移值(带caption)</a><br> <a href="javascript:prn1_preview()">测试紧跟关联表格后面的htm自动分页</a><br> <script language="javascript" type="text/javascript"> var LODOP; //声明为全局变量 function prn0_preview() { LODOP=getLodop(); LODOP.PRINT_INIT(""); LODOP.SET_PRINT_PAGESIZE(1,1000,1000,""); LODOP.ADD_PRINT_TEXT(10,30,317,23,"第一页显示的标题内容"); LODOP.ADD_PRINT_TABLE("10mm",0,"100%","100%",document.getElementById("p").innerHTML); LODOP.SET_PRINT_STYLEA(0,"Offset2Top",-20); //设置小的次页偏移,正常 LODOP.ADD_PRINT_HTM(0,0,"100%","100%",document.getElementById("last").innerHTML+document.getElementById("last").innerHTML+document.getElementById("last").innerHTML); LODOP.SET_PRINT_STYLEA(0,"LinkedItem",-1); //LODOP.PRINT_DESIGN(); LODOP.PREVIEW(); }; function prn01_preview() { LODOP=getLodop(); LODOP.PRINT_INIT(""); LODOP.SET_PRINT_PAGESIZE(1,1000,1000,""); LODOP.ADD_PRINT_TEXT(10,30,317,23,"第一页显示的标题内容"); LODOP.ADD_PRINT_TABLE("10mm",0,"100%","100%",document.getElementById("p").innerHTML); LODOP.SET_PRINT_STYLEA(0,"Offset2Top",-50); //设置大的次页偏移,次页偏移把caption的距离也偏移上 LODOP.ADD_PRINT_HTM(0,0,"100%","100%",document.getElementById("last").innerHTML+document.getElementById("last").innerHTML+document.getElementById("last").innerHTML);//关联表格,形成关联串,top值偏移后整个串的起始位置 LODOP.SET_PRINT_STYLEA(0,"LinkedItem",-1); //LODOP.PRINT_DESIGN(); LODOP.PREVIEW(); }; function prn1_preview() { LODOP=getLodop(); LODOP.PRINT_INIT(""); LODOP.SET_PRINT_PAGESIZE(1,1000,1000,""); LODOP.ADD_PRINT_TEXT(10,30,317,23,"第一页显示的标题内容"); LODOP.ADD_PRINT_TABLE("10mm",0,"100%","100%",document.getElementById("p2").innerHTML); LODOP.SET_PRINT_STYLEA(0,"Offset2Top",-30); //去掉caption,不用再偏移caption的高度 LODOP.ADD_PRINT_HTM(0,0,"100%","100%",document.getElementById("last").innerHTML+document.getElementById("last").innerHTML+document.getElementById("last").innerHTML); LODOP.SET_PRINT_STYLEA(0,"LinkedItem",-1); //LODOP.PRINT_DESIGN(); LODOP.PREVIEW(); }; </script> </body>
图示:
原文地址:https://www.cnblogs.com/huaxie/p/11662351.html
- 使用Java代码通过JDBC连接只启用Sentry的Impala异常分析
- 如何在CDSW中定制Docker镜像
- 干货:排名前 16 的 Java 工具类!
- 危险:会话固定攻击漏洞,你们的系统都堵上了吗?
- 深度学习入门者必看:25个你一定要知道的概念
- 如何在CM中启用YARN的使用率报告
- 如何修改CDSW服务的DNS和HOSTNAME
- 想尝试搭建图像识别系统?这里有一份TensorFlow速成教程
- 如何查看集成Sentry后Hive作业的真实用户
- 如何在Impala中实现拉链表
- 多图见证模拟机器人的逆天成长:论进化策略在强化学习中的应用
- Hue禁止用户下载数据问题分析
- 如何在RedHat6上使用Bind搭建DNS服务
- 如何使用Cloudera Manager升级Spark2.1版本至Spark2.2
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 使用Android Studio实现为系统级的app签名
- Android开发实现控件双击事件的监听接口封装类
- Android普通应用升级为系统应用并获取系统权限的操作
- 使用kotlin协程提高app性能(译)
- Android中实现ping功能的多种方法详解
- Android开发获取手机内网IP地址与外网IP地址的详细方法与源码实例
- 在Android源码中编译出指定jar包的操作
- Android Studio 视频播放失败 start called in state1 异常怎么解决
- 解决Android 源码编译错误的问题
- Android 实现列表倒计时功能
- Android 多渠道(友盟)打包教程分享
- Android Broadcast 和 BroadcastReceiver的权限限制方式
- [GO] 变参函数-GO中函数传递变长参数
- 基于Android-Skin-Loader实现换肤效果
- 通过 Nginx 实现最简单的Nas服务器(文件分享)