发新话题
打印

【jcp使用手册】设置图文并茂的页眉页脚

【jcp使用手册】设置图文并茂的页眉页脚

页眉页脚即是打印在每页上部、下部的内容,JCP允许你在myDoc对象中,设置页眉,页脚,也可以在页眉、页脚中显示当前页号,总页数,当前日期等信息。 要生成如图所示页眉,需要设置如下:
复制内容到剪贴板
代码:
<script> function print() { var myDoc = { header : { html : document.getElementById('myheader') // 也可以为字符串类型,如'<span>杰创软件</span>' }, documents : document, copyrights : '杰创软件拥有版权 www.jatools.com' } getJCP().printPreview(myDoc); } </script> <div id='myheader' style='display:none'> <div style="border-bottom: 1px solid black; text-align: right"> <img style="float: left" border="0" src="logojj.gif" width="176" height="53"> <span> <strong>杭州杰创软件有限公司</strong><br> 地址:杭州市西斗门路3号天堂软件园A幢19层A座 邮编:310012<br> 总机:0571-88254255 北京办事处:010-51297501 </span> </div> </div>
其中myDoc.header属性是一个Object对象,该对象可以有两个属性: html 表示页眉上应该显示的html内容,该对象为HTML DOM对象时,如本例,则取其innerHTML为页眉内容,如果是字符串,则直接就是页眉内容。 height: 表示该页眉需要占用的高度,以像素为单位,默认以html内容形成的高度。 页脚用myDoc.footer属性指定,可以有htmlheight属性,用法与header类似。 如下所示:
复制内容到剪贴板
代码:
var myDoc = { footer : { html : '<div style="text-align: right; border-top: 1px solid black;"><strong> #D #T #p/#P </strong></div>', height:50 }, documents : document, copyrights : '杰创软件拥有版权 www.jatools.com' } getJCP().printPreview(myDoc);
效果如下: 页脚中,显示了当前日期及时间,和当前页,总页数。 JCP发现页眉页脚中,有#号开始的字符,就会从以下表中,找到有没有对应项,如果有,就计算并替换:
#p 当前页号
#P 总页数
#d 当前日期,以控制面板/区域与语言选项中设置的短日期格式
#D 当前日期,长日期格式
#t 当前时间,长时间格式
#T 当前时间,长时间格式

TOP

TOP

发新话题