lodop预览多张不同的单据时，各个表头等信息不重叠
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- saved from url=(0049)https://www.lodop.net/demolist/PrintSample43.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>WEB打印控件LODOP的样例四十三:演示综合表格分页打印</title>
<meta name="keywords" content="Lodop、Lodop打印控件、WEB打印、C-Lodop、CLodop、lodop控件、云打印、手机打印、免费、AO打印">
<meta name="description" content="Lodop、Lodop打印控件、WEB打印、C-Lodop、CLodop、lodop控件、云打印、手机打印、免费、AO打印">
<script language="javascript" src="./四十三_演示综合表格分页打印_files/LodopFuncs.js"></script>
</head>
<body>
<iframe src="./四十三_演示综合表格分页打印_files/k_hlp.html" width="500" height="46" frameborder="0" scrolling="no" style="float:right;background:inherit;"></iframe>
<h2><font color="#009999">演示综合表格分页打印：</font></h2>
<p>如下是几个div包裹的超文本内容，现在演示用这些内容组合起来打印输出<b>两个发货单</b>，点<a href="javascript:PreviewMytable();">打印预览</a>看一下。</p>
<p>为了避免本文档太长，每个发货单都用div2当主体表格，该表格因超出纸高被自动分页，其它带颜色的div分别作为它们的页眉页脚。</p>
<p>本例用<font color="#0000FF">NewPageA</font>对两个发货单进行了分页，眉脚对象与主体表格进行了关联。</p>
<p>----------------------div1:------------------------------------------------------------------------------------</p>
<div id="div1">
<div style="LINE-HEIGHT: 30px" class="size16" align="center"><strong><font color="#0000FF">销售发货单-01</font></strong></div>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td width="43%"><font color="#0000FF">所在店铺：<span id="rpt_Pro_Order_List_ctl00_lbl_eShop_Name">雅瑞专卖店</span></font></td>
<td width="33%"><font color="#0000FF">发货单号：<span>2011050810372</span></font></td>
<td><font color="#0000FF">快递单号：</font></td></tr>
<tr>
<td><font color="#0000FF">收 件 人：<span>王斌</span></font></td>
<td><font color="#0000FF">网店单号：<span>74235823905643</span></font><font color="#0000FF"></font></td>
<td><font color="#0000FF">发货日期：2011-5-10</font></td></tr>
<tr>
<td><font color="#0000FF">电话号码：<span>13935429860 </span></font></td>
<td><font color="#0000FF">收件人ID：<span>云星王斌</span></font></td>
<td><font color="#0000FF"> </font></td></tr></tbody></table>
</div>
<p>----------------------div2:------------------------------------------------------------------------------------</p>
<div id="div2">
<table border="1" cellspacing="0" cellpadding="1" width="100%" style="border-collapse:collapse" bordercolor="#333333">
<thead>
<tr>
<td width="10%">
<div align="center"><b>表格页眉</b></div></td>
<td width="25%">
<div align="center"><b>品名</b></div></td>
<td width="10%">
<div align="center"><b>颜色</b></div></td>
<td width="10%">
<div align="center"><b>规格</b></div></td>
<td width="10%">
<div align="center"><b>数量</b></div></td>
<td width="15%">
<div align="center"><b>单价</b></div></td>
<td width="20%">
<div align="center"><b>金额</b></div></td></tr>
</thead>
<tbody>
<tr>
<td> TB_AMJ006</td>
<td>名称01</td>
<td>浅灰色</td>
<td>185/10</td>
<td>1</td>
<td>248.00</td>
<td>248.00</td></tr>
<tr>
<td> </td>
<td>名称02</td>
<td> </td>
<td> </td>
<td>2</td>
<td>50</td>
<td>100</td></tr>
<tr>
<td> </td>
<td>名称03</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称04</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称05</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称06</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称07</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称08</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称09</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称10</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称11</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称12</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称13</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称14</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称15</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称16</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称17</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称18</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称19</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称20</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称21</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称22</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称23</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称24</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称25</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称26</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称27</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称28</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称29</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称30</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称31</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称32</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称33</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称34</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称35</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td></td>
</tr>
<tr>
<td> </td>
<td>名称36</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称37</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td></td>
</tr>
<tr>
<td> </td>
<td>名称38</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称39</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称40</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称41</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称42</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>123</td>
</tr>
<tr>
<td> </td>
<td>名称43</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>名称44</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>10</td>
</tr>
</tbody><tfoot>
<tr>
<td><b>表格页脚</b></td>
<td><b>本页动态合计</b></td>
<td><b> </b></td>
<td tdata="pageNO" format="#" align="left">
<p align="center"><b>第<font color="#0000FF">#</font>页</b></p>
</td>
<td tdata="pageCount" format="#" align="left">
<p align="center"><b>总<font color="#0000FF">##</font>页</b></p></td>
<td width="14%" align="right"> </td>
<td width="19%" tdata="subSum" format="#,##0.00" align="right"><font color="#0000FF">###元</font></td>
</tr>
</tfoot>
</table>
</div>
<p>----------------------div3:------------------------------------------------------------------------------------</p>
<div id="div3">
<div style="LINE-HEIGHT: 30px" align="center"><font color="#0000FF">感谢您对我们雅瑞专卖店的支持，(发货单01的表格外“页脚”，紧跟表格)</font></div>
</div>
<p>----------------------div4:------------------------------------------------------------------------------------</p>
<div id="div4">
<div style="LINE-HEIGHT: 30px" class="size16" align="center"><strong><font color="#FF0000">销售发货单---02</font></strong></div>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td width="43%"><font color="#FF0000">店铺名称：<span id="rpt_Pro_Order_List_ctl00_lbl_eShop_Name"><b>黄阁专卖店</b></span></font></td>
<td width="33%"><font color="#FF0000">物流单号：<span>2011050810373</span></font></td>
</tr>
<tr>
<td><font color="#FF0000">收 货 人：<span>刘波</span></font></td>
<td><font color="#FF0000">网店订单：<span>74235823905644</span></font></td>
</tr>
</tbody></table>
</div>
<div id="div5">
<div style="LINE-HEIGHT: 30px" class="size16" align="center"><strong><font color="#FF0000">销售发货单---------------------------------02-----5</font></strong></div>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td width="43%"><font color="#FF0000">店铺名称555：<span id="rpt_Pro_Order_List_ctl00_lbl_eShop_Name"><b>黄阁专卖店55555</b></span></font></td>
<td width="33%"><font color="#FF0000">物流单号555：<span>2011050810373</span></font></td>
</tr>
<tr>
<td><font color="#FF0000">收 货 人：<span>刘波</span></font></td>
<td><font color="#FF0000">网店订单：<span>74235823905644</span></font></td>
</tr>
</tbody></table>
</div>
<div id="div6">
<div style="LINE-HEIGHT: 30px" class="size16" align="center"><strong><font color="#FF0000">销售发货单-----------------------------------------------------------------02--6666</font></strong></div>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td width="43%"><font color="#FF0000">店铺名称666：<span id="rpt_Pro_Order_List_ctl00_lbl_eShop_Name"><b>黄阁专卖店666</b></span></font></td>
<td width="33%"><font color="#FF0000">物流单号666：<span>2011050810373</span></font></td>
</tr>
<tr>
<td><font color="#FF0000">收 货 人：<span>刘波</span></font></td>
<td><font color="#FF0000">网店订单：<span>74235823905644</span></font></td>
</tr>
</tbody></table>
</div>
<p>---------------------------------------------------------------------------------------------------------------</p>
<p><a href="https://www.lodop.net/LodopDemo.html"><<回样例目录</a>
</p>
<script>
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);//位置：1
LODOP.SET_PRINT_STYLEA(0,"Vorient",3);
LODOP.ADD_PRINT_HTM(26,"5%","90%",109,document.getElementById("div1").innerHTML);//位置：2
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);//位置：3
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);//位置：4
LODOP.SET_PRINT_STYLEA(0,"Vorient",3);
LODOP.ADD_PRINT_HTM(26,"5%","90%",80,document.getElementById("div4").innerHTML);//位置：5
LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
LODOP.SET_PRINT_STYLEA(0,"LinkedItem",4);//在位置：4
LODOP.ADD_PRINT_HTM(444,"5%","90%",54,document.getElementById("div3").innerHTML);//位置：6
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);//位置：7
LODOP.SET_PRINT_STYLEA(0,"Vorient",3);
LODOP.ADD_PRINT_HTM(26,"5%","90%",80,document.getElementById("div5").innerHTML);//位置：8
LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
LODOP.SET_PRINT_STYLEA(0,"LinkedItem",7);//在位置：7
LODOP.ADD_PRINT_HTM(444,"5%","90%",54,document.getElementById("div3").innerHTML);//位置：9
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);//位置：10
LODOP.SET_PRINT_STYLEA(0,"Vorient",3);
LODOP.ADD_PRINT_HTM(26,"5%","90%",80,document.getElementById("div6").innerHTML);//位置：11
LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
LODOP.SET_PRINT_STYLEA(0,"LinkedItem",10); //在位置：10
LODOP.ADD_PRINT_HTM(444,"5%","90%",54,document.getElementById("div3").innerHTML);//位置：12
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);//位置：13
LODOP.SET_PRINT_STYLEA(0,"Vorient",3);
LODOP.ADD_PRINT_HTM(26,"5%","90%",80,document.getElementById("div6").innerHTML);//位置：14
LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
LODOP.SET_PRINT_STYLEA(0,"LinkedItem",13); //在位置：10
LODOP.ADD_PRINT_HTM(444,"5%","90%",54,document.getElementById("div3").innerHTML);//位置：115
LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
LODOP.SET_PRINT_STYLEA(0,"LinkedItem",1);
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='pageNO'>第##页</span>/<span tdata='pageCount'>共##页</span></font>");
LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
LODOP.SET_PRINT_STYLEA(0,"Horient",1);
LODOP.ADD_PRINT_TEXT(3,34,196,20,"总页眉：《两个发货单的演示》");
LODOP.SET_PRINT_STYLEA(0,"ItemType",1);
LODOP.PREVIEW();
};
</script>
</body></html>
扫一扫
4612
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
