LODOP中可以用ADD_PRINT_TABLE、ADD_PRINT_HTM、ADD_PRINT_HTML、ADD_PRINT_TBURL等可以输出超文本的表格,超文有超过打印项高度或纸张高度自动分页的特点,具体可查看本博客相关博文:LODOP中ADD_PRINT_TABLE、HTM、HTML表格自动分页测试
如上博文,ADD_PRINT_HTM自动分页后,可以补线,第二页的表格上方可还存在表格线。

但是如果table标签不加border样式,所有border样式都加在td里,那么自动分页后就会出现表格线上方缺失的情况。
解决方法是在table标签里加border样式,直接在table标签里加border比较好。
用css样式加给table标签加border也可以,由于浏览器解析等也可能存在一些问题。
最好是:直接在table标签里加border属性。

本文三个问题:
1.table自动分页,分页后的上边缘没有边框。
2.table自动分页后线条后面有多余部分。
可直接在table标签里加border属性。<table border="1"。。。这样。
3.table中表格线没有连起来。
在table标签里加cellspacing="0" cellpadding="0"试试。
代码:

<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="div1">
<table cellspacing="0" cellpadding="0">
<tr>
<td>lodop</td>
<td>c-lodop</td>
<td>c-lodop</td>
</tr>
<tr>
<td>text</td>
<td>html</td>
<td>html</td>
</tr>
<tr>
<td>LODOP</td>
<td>C_LODOP</td>
<td>HTML</td>
</tr>
</table>
</div>
<div id="div2">
<table cellspacing="0" cellpadding="0" border="1">
<tr>
<td>lodop</td>
<td>c-lodop</td>
<td>c-lodop</td>
</tr>
<tr>
<td>text</td>
<td>html</td>
<td>html</td>
</tr>
<tr>
<td>LODOP</td>
<td>C_LODOP</td>
<td>HTML</td>
</tr>
</table>
</div>
<a href="javascript:prn1_preview()">table分页补线</a><br>
<script language="javascript" type="text/javascript">
var LODOP; //声明为全局变量
function prn1_preview() {
LODOP=getLodop();
LODOP.PRINT_INIT("");
var strStyle1="<style>td {border: 1 solid #000000;border-collapse:collapse; }</style>";
var strStyle2="<style>table,td{border: 1 solid #000000;border-collapse:collapse; }</style>";
var strHtml=strStyle1+document.getElementById("div1").innerHTML;//td加了border样式
var strHtml2=strStyle2+document.getElementById("div1").innerHTML;//td和table加了css样式的border样式
var strHtml3=strStyle1+document.getElementById("div2").innerHTML;//td加了border样式,table标签本身加了boder="1"
LODOP.ADD_PRINT_HTM(10,10,200,32,strHtml);
LODOP.ADD_PRINT_HTM(60,10,200,32,strHtml2);
LODOP.ADD_PRINT_HTM(120,10,200,32,strHtml3);
LODOP.PRINT_DESIGN();
//LODOP.PREVIEW();
};
</script>
</body>

图示
1.只在td里加border,table不加border样式,分页后上边缘没有线。
2.在table里加css样式,设置border,分页后下边缘凸出有多余部分。
3.直接在table标签里加border属性,td里也加border,正常。

如果出现的不是分页后表格没有上边缘,而是单元格之间有空格,看起来像是线没有连接起来一样,这种状况:
1.可以在table标签里设置cellspacing="0" cellpadding="0"。
2.给table也加css的border样式。
3.给table标签直接加加border=“”,加cellspacing="0" cellpadding="0"。

如图,第一个表格table标签本身没加border,也没加cellspacing="0" cellpadding="0",只给td加样式。
有前面可知,不给tablel标签加border,会导致自动份后确实上边缘线,这个也不加cellspacing="0" cellpadding="0",导致单元格间隙,出现单元格连不起来的状况。

代码:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WEB打印控件LODOP</title>
<script language="javascript" src="LodopFuncs.js"></script>
<style>table,td {border:solid 1px black;border-collapse: collapse }</style>
</head>
<body>
<div id="div1">
<!--<table cellspacing="0" cellpadding="0" border="1">-->
<table>
<tr>
<td>lodop</td>
<td>c-lodop</td>
<td>c-lodop</td>
</tr>
<tr>
<td>text</td>
<td>html</td>
<td>html</td>
</tr>
<tr>
<td>LODOP</td>
<td>C_LODOP</td>
<td>HTML</td>
</tr>
</table>
</div>
<a href="javascript:prn1_preview()">打印预览纯文本和超文本样式</a><br>
<script language="javascript" type="text/javascript">
var LODOP; //声明为全局变量
function prn1_preview() {
LODOP=getLodop();
LODOP.PRINT_INIT("");
var strStyle1="<style>td {border:solid 1px black;border-collapse: collapse }</style>";
var strStyle2="<style>table,td{border:solid 1px black;border-collapse: collapse }</style>";
var strHtml=strStyle1+document.getElementById("div1").innerHTML;
var strHtml2=strStyle2+document.getElementById("div1").innerHTML;
LODOP.ADD_PRINT_HTM(10,10,200,32,strHtml);
LODOP.ADD_PRINT_HTM(60,10,200,32,strHtml2);
LODOP.PRINT_DESIGN();
//LODOP.PREVIEW();
};
</script>
</body>

图示:

本文用了 solid 1px black;1 solid #000000;等样式,似乎哪种写法都可以,但是浏览器有些可能会不认。
比如border:1 solid #000000;这个,可以查看浏览器开发者模式,看到这个属性上有叹号Invalid property value,并且页面可能无法显示,虽然lodop中有可能可以,但是建议样式用比较规范的写法。关于table的样式,以后自己会测试一些。

此外,如果是add_print_table表格和上方表格线连不起来问题,这种也是表格线有空格,可查看本博客另一篇博文:LODOP中tfoot和tbody中间线连不起来

LODOP中table自动分页补线加border的更多相关文章

  1. LODOP统计table自动分页后的每页的某列合计值

    LODOP中超文本会根据打印项高度或超过纸张,自动分页.(相关博文:Lodop打印控件 超文本自动分页.LODOP中ADD_PRINT_TABLE.HTM.HTML表格自动分页测试.Lodop打印表格 ...

  2. iview中table多选、加载更多、下载等使用

    记录工作中的点点滴滴,为回忆过往添加片片记忆... 一.Table 1.使用render函数多层渲染以及表格可展开使用 源码地址:https://gitee.com/Mandy_wang/iview- ...

  3. LODOP表格table简短问答及相关博文

    LODOP打印表格超文本输出表格:ADD_PRINT_HTML.ADD_PRINT_HTM.ADD_PRINT_TABLE.ADD_PRINT_TBURL打印表格带页头页尾 参考样例15 http:/ ...

  4. LODOP中ADD_PRINT_TABLE、HTM、HTML表格自动分页测试

    LODOP中超文本超过打印项高度会自动分页,那么对于超大行,该行处在分页高度位置会怎样呢?本文用来测试一下三个语句对html中table中超大行在分页高度位置的处理. 测试结果:ADD_PRINT_T ...

  5. Lodop的TABLE中format格式化的使用

    LODOP中的ADD_PRINT_TABLE支持很多函数和计算方法,可以用tdata对table表格里额数据进行计算,用format对结果进行格式化.这个format只能和tdata搭配使用,不能单独 ...

  6. LODOP中tfoot和tbody中间线连不起来

    这种情况发生在使用ADD_PRINT_TABLE时,ADD_PRINT_TABLE是Lodop中专门用来输出table表格的语句,它有很多特点,比如该语句不切行(详细可参考查看本博客相关博文:LODO ...

  7. LODOP中page-break-before:always给div分页

    Lodop中超过超文本打印项高度会自动分页:Lodop打印控件 超文本自动分页Lodop中还有NewPage和NewPageA,用于手动分页:Lodop强制分页LODOP.NewPage()和LODO ...

  8. LODOP打印table表格宽度固定-超宽隐藏

    之前有博文介绍关于超出div隐藏内容的:LODOP打印超过后隐藏内容样式里面提到了overflow:hidden;控制超出后隐藏,但是前面那篇用的是div,如果是在table中,由于table默认的t ...

  9. LODOP中带caption的表格被关联并次页偏移测试

    ADD_PRINT_TABLE中的thead和tfoot可以每页输出,后面的打印项关联表格,可以紧跟着表格,实现在表格后面紧跟着输出内容的效果,表格可以自动分页,并总是跟在表格后面 ,在表格最后输出. ...

随机推荐

  1. webuploader如何实现分片+断点续传

    javaweb上传文件 上传文件的jsp中的部分 上传文件同样可以使用form表单向后端发请求,也可以使用 ajax向后端发请求 1. 通过form表单向后端发送请求 <form id=&quo ...

  2. stos指令

    mov ecx,30mov eax,0cccccccchrep stos dword prt es:[edi]stos指令,它的功能是将eax中的数据放入的edi所指的地址中,同时,edi会增加4个字 ...

  3. 【dp】p1025数的划分

    题目描述] 将整数n分成k份,且每份不能为空,任意两份不能相同(不考虑顺序). 例如:n=7,k=3,下面三种分法被认为是相同的. 1,1,5: 1,5,1: 5,1,1: 问有多少种不同的分法. 输 ...

  4. luogu P1058 立体图

    做了这个题后明确了自己的定位... 恩...普及- 题目大意估计都知道.. 给个传送门:   luogu 做了半上午 + 一整个下午的题... 占了我今天到的绝大多数时间. 其实此题不难, 核心代码我 ...

  5. [mysql8]新坑哈 更改Mysql 表的大小转换设置lower_case_table_names=1

    在安装了8.0.14之后,初始化的时候在my.cnf里设置了lower_case_table_names=1,安装好了之后,启动报错: 1 2 3 4 5 2019-01-28T13:24:24.91 ...

  6. socket.error: [Errno 9] Bad file descriptor

    这个错误很明显 ,是因为你关闭了套接字对象后,又再次去调用了套接字对象,此时套接字链接已经被关闭,你不能再去调用,所以才会出现这种错误,复查一下自己的代码,很快就可以解决. 参考: https://b ...

  7. 记一次vue+vuex+vue-router+axios+elementUI开发(一)

    记录自己的vue开发之旅,方便之后查询 一.开发环境 1.安装node.js  自带npm https://nodejs.org/en/ 2. 全局安装vue-cli脚手架 npm install v ...

  8. 加入购物车的功能wepy

    1.先有一个加入购物车的按钮 <view wx:if="{{(detaildata.boughtNum < detaildata.buy_limit) && de ...

  9. nginx 配置的server_name参数

    nginx中的server_name指令主要用于配置基于名称虚拟主机. 一 匹配顺序,server_name指令在接到请求后的匹配顺序如下: 1.确切的server_name匹配,例如: server ...

  10. NGUI: Next-Gen UI 2018.3.0f

    https://assetstore.unity.com/packages/tools/gui/ngui-next-gen-ui-2413 NGUI is a very powerful UI sys ...