WEB打印分页类(JS)

作者：ttyp 来源：ttyp的blog 时间：2008-01-22 14:02:00　

1.如果每页都增加打印时间,又如何设置?

打印时间的,你可以参考

for(var i=0;i<page.length;i++){
page[i] = page[i].replace(/\<\!--ct-->/g,(i+1)+'/' + tp).replace(/\<\!--cp--\>/g,i+1).replace(/\<\!--tp--\>/g,tp);
}

做一个宏,如作为时间宏,然后替换

2.如果数据的表头是多层,如两层,在第一页表头显示不正常,多显示一行,用pp.hideRows("1");就可以解决,这又为什么?

有个好奇怪的现象:我将上面的代码变成HTML文件后,按"打印"数据有分开,但是不能分页打印,但是我把打印类用到其它地方就可以用.

多行表头暂时没有考虑到

<HTML><HEAD><TITLE>print</TITLE><meta http-equiv="content-type" content="text/html;charset=gb2312"><style>/**//** * 打印相关*/ @media print {}{ .notprint { display:none; } .PageNext {}{ page-break-after:always; } }@media screen {}{ .notprint { display:inline; cursor:hand; }}.text1{}{ width: 120px; overflow: hidden; text-overflow:ellipsis;}.text2{}{ width: 80px; overflow: hidden; text-overflow:ellipsis;}</style><script language="javascript">/g,(i+1)+'/' + tp).replace(/\<\!--cp--\>/g,i+1).replace(/\<\!--tp--\>/g,tp); } head.style.display = 'none'; foot.style.display = 'none'; table.style.display = 'none'; if(page.length>1){ me.board.innerHTML = page.join("\n<div class='pageNext'></div>"); }else{ me.board.innerHTML = page.join(""); } }function getOuterHTML (node) { if(typeof(node)!="undefined"&&typeof(node.outerHTML)!="undefined"){ return node.outerHTML; } var emptyElements = { HR: true, BR: true, IMG: true, INPUT: true }; var specialElements = { TEXTAREA: true }; var html = ''; switch (node.nodeType){ case Node.ELEMENT_NODE: html += '<'; html += node.nodeName; if (!specialElements[node.nodeName]) { for (var a = 0; a < node.attributes.length; a++) html += ' ' + node.attributes[a].nodeName.toUpperCase() + '="' + node.attributes[a].nodeValue + '"'; html += '>'; if (!emptyElements[node.nodeName]){ html += node.innerHTML; html += '<\/' + node.nodeName + '>'; } } else switch (node.nodeName){ case 'TEXTAREA': var content = ''; for (var a = 0; a < node.attributes.length; a++) if (node.attributes[a].nodeName.toLowerCase() != 'value') html += ' ' + node.attributes[a].nodeName.toUpperCase() + '="' + node.attributes[a].nodeValue + '"'; else content = node.attributes[a].nodeValue; html += '>'; html += content; html += '<\/' + node.nodeName + '>'; break; } break; case Node.TEXT_NODE: html += node.nodeValue; break; case Node.COMMENT_NODE: html += '<!' + '--' + node.nodeValue + '--' + '>'; break; } return html;} function getTable(header,table,content,footer){ var htm = ""; if(typeof(header)!="undefined"){ htm += getOuterHTML(header); } if(typeof(table)!="undefined"){ htm += "\n<" + table.tagName; for(var i =0;i<table.attributes.length;i++){ if(table.attributes[i].specified){ if(table.attributes[i].name=="style") htm += " style='" + table.style.cssText + "'"; else htm += " " + table.attributes[i].nodeName + "='" + table.attributes[i].nodeValue + "'"; } } if(table.rows.length>0){ htm += ">\n" + getOuterHTML(table.rows[0]) + content + "</" + table.tagName + ">"; } else { htm += ">\n" + content + "</" + table.tagName + ">\n"; } } if(typeof(footer)!="undefined"){ htm += getOuterHTML(footer); } return htm; } if(!window.attachEvent){ window.attachEvent = function(){window.addEventListener(arguments[0].substr(2),arguments[1],arguments[2]);} }}var pp = new CLASS_PRINT();window.onload = function(){ pp.header = document.getElementById("tabHeader"); pp.content= document.getElementById("tabDetail"); pp.footer = document.getElementById("tabFooter"); pp.hideCols("5,7"); pp.hideRows("3,15"); pp.pageSize = 10; }//--></script></HEAD><BODY onbeforeprint="pp.beforePrint()" onafterprint="pp.afterPrint()"><table border=0 width="95％" align=center id="tabHeader"> <tr> <td align="center">元件列表</td> </tr> <tr> <td>日期:2005年12月12日</td> </tr></table><table border=1 width="95％" style="border-collapse:collapse;" align=center cellpadding=3 id="tabDetail"> <tr bgcolor='#e8f4ff'> <td align="center" width="35">序号</td> <td width="160">产品名称</td> <td>规格型号</td> <td align="center">品牌</td> <td align="right">数量</td> <td width="125">供应商</td> <td align="right">实际数量</td> <td align="center">包装</td> <td align="center">需用日期</td> </tr> <tr> <td align="center">1</td> <td> 贴片电路 </td> <td> ADE7755ARS </td> <td align="center">ADI</td> <td align="right">1000</td> <td width="125">世健国际贸易（上海）有限公司</td> <td align="right">1003</td> <td align="center">59</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">2 </td> <td> 贴片电容 </td> <td> C2012X7R1H104KT </td> <td align="center">TDK</td> <td align="right">8000</td> <td width="125">南京商络电子有限公司</td> <td align="right">8000</td> <td align="center">4000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">3 </td> <td> 贴片电容 </td> <td> C2012COG1H200JT </td> <td align="center">TDK</td> <td align="right">2000</td> <td width="125">南京商络电子有限公司</td> <td align="right">4000</td> <td align="center">4000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">4 </td> <td> 贴片电容 </td> <td> C2012X7R1H333KT </td> <td align="center">TDK</td> <td align="right">4000</td> <td width="125">南京商络电子有限公司</td> <td align="right">4000</td> <td align="center">4000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">5 </td> <td> 压敏电阻 </td> <td> GND20D681K </td> <td align="center">中普</td> <td align="right">1000</td> <td width="125">苏州中普电子有限公司</td> <td align="right">1000</td> <td align="center">1000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">6 </td> <td> 晶振 </td> <td> HC-49U/S 3.579545MHz 20pf 带垫片 </td> <td align="center">海创</td> <td align="right">1000</td> <td width="125">武汉海创电子有限公司</td> <td align="right">1000</td> <td align="center">200</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">7 </td> <td> 安规电容 </td> <td> 275V-X2-0.47μF </td> <td align="center">昱电</td> <td align="right">1000</td> <td width="125">上海昱电电子有限公司</td> <td align="right">1000</td> <td align="center">1000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">8 </td> <td> 电解电容 </td> <td> CD112 16V 33μF </td> <td align="center">Samyoung</td> <td align="right">2000</td> <td width="125">上海文得贸易有限公司</td> <td align="right">2000</td> <td align="center">2000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">9 </td> <td> 电解电容 </td> <td> CD112S 16V 220μF </td> <td align="center">Samyoung</td> <td align="right">1000</td> <td width="125">上海文得贸易有限公司</td> <td align="right">2000</td> <td align="center">2000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">10 </td> <td> 电解电容 </td> <td> CD112S 35V 470μF </td> <td align="center">Samyoung</td> <td align="right">1000</td> <td width="125">上海文得贸易有限公司</td> <td align="right">1000</td> <td align="center">1000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">11 </td> <td> 插件电阻 </td> <td> RSF2BJ 470Ω </td> <td align="center">KOA</td> <td align="right">1000</td> <td width="125">上海凡元电子有限公司</td> <td align="right">1000</td> <td align="center">100</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">12 </td> <td> 发光二极管 </td> <td> L-314LRC-A-SS </td> <td align="center">HUADING</td> <td align="right">1000</td> <td width="125">上海沪鼎电子有限公司</td> <td align="right">1000</td> <td align="center">1000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">13 </td> <td> 插件二、三极管 </td> <td> 1N4744A </td> <td align="center">MCC</td> <td align="right">1000</td> <td width="125">励智电子（上海）有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">14 </td> <td> 磁珠 </td> <td> B62 </td> <td align="center">JONES</td> <td align="right">2000</td> <td width="125">北京中石伟业技术有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">15 </td> <td> 晶振 </td> <td> CFS206 32.768kHz 20ppm/12.5pf </td> <td align="center">CITIZEN</td> <td align="right">1000</td> <td width="125">上海创邦国际贸易有限公司</td> <td align="right">1000</td> <td align="center">1000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">16 </td> <td> 贴片电阻 </td> <td> RC0805JR-071K2 </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">17 </td> <td> 贴片电阻 </td> <td> RC0805FR-071K2 </td> <td align="center">YAGEO</td> <td align="right">2000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">18 </td> <td> 贴片电阻 </td> <td> RC0805JR-0710R </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">19 </td> <td> 贴片电阻 </td> <td> RC0805JR-0710K </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">20 </td> <td> 贴片电阻 </td> <td> RC0805JR-07150K </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">21 </td> <td> 贴片电阻 </td> <td> RC0805FR-071K </td> <td align="center">YAGEO</td> <td align="right">2000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">22 </td> <td> 贴片电阻 </td> <td> RC0805JR-072K4 </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">23 </td> <td> 贴片电阻 </td> <td> RC0805JR-0720K </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">24 </td> <td> 贴片电阻 </td> <td> RC0805JR-072K </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">25 </td> <td> 贴片电阻 </td> <td> RC0805JR-07390K </td> <td align="center">YAGEO</td> <td align="right">3000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">26 </td> <td> 贴片电阻 </td> <td> RC0805JR-0739K </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr> <tr> <td align="center">27 </td> <td> 贴片电阻 </td> <td> RC0805JR-074K7 </td> <td align="center">YAGEO</td> <td align="right">1000</td> <td width="125">上海衡谦贸易有限公司</td> <td align="right">5000</td> <td align="center">5000</td> <td align="center">2005-11-04</td> </tr></table><table width="95％" border=0 id="tabFooter" align=center cellpadding=4> <tr> <td></td><td align=right>上海市XXX有限公司</td> </tr></table><div id="divPrint"></div><table width="95％" align=center> <tr> <td align=right> <input type=button id="bp" onclick="pp.beforePrint();this.disabled = true;document.getElementById('ap').disabled = false;" value="打印前" style="border:1px solid #000000"> <input id="ap" type=button onclick="pp.afterPrint();this.disabled = true;document.getElementById('bp').disabled = false;" value="打印后" style="border:1px solid #000000" disabled=true> <input type=button value='打印' onclick="window.print()" style="border:1px solid #000000"> </td> </tr></table></BODY></HTML>

标签：打印,js

投稿

WEB打印分页类(JS)

猜你喜欢

Laravel实现批量更新多条数据

python命令行参数解析OptionParser类用法实例

python使用celery实现异步任务执行的例子

Python文件的操作示例的详细讲解

分享五个超实用Python脚本,减少垃圾软件负担

MySQL数据库监控软件lepus使用问题以及解决办法

基于python实现学生管理系统

python logging 日志轮转文件不删除问题的解决方法

微信小程序如何处理token过期问题

利用Python制作动态排名图的实现代码

python脚本框架webpy模板赋值实现

python 多线程死锁问题的解决方案

sql自动增长标识导致导入数据问题的解决方法

Python执行ping操作的简单方法

Oracle中pivot函数图文实例详解

Golang实现请求限流的几种办法(小结)

OpenCV计算平均值cv::mean实例代码

Python读写Redis数据库操作示例

解析SQL Server与ASP互操作的时间处理

python OpenCV 实现高斯滤波详解