web打印分页

<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">
<!--

/**//*
** ==================================================================================================
** 类名:CLASS_PRINT
** 功能:打印分页
** 示例:
---------------------------------------------------------------------------------------------------

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;
}

<BODY onbeforeprint="pp.beforePrint()" onafterprint="pp.afterPrint()">


---------------------------------------------------------------------------------------------------
** 作者:ttyp
** 邮件:ttyp@21cn.com
** 日期:2005-12-13
** ==================================================================================================
*/
function CLASS_PRINT()
{
this.header = null;
this.content = null;
this.footer = null;
this.board = null;
this.pageSize = 10;

var me = this;

//哈希表类
function Hashtable()
{
this._hash = new Object();
this.add = function(key,value){
if(typeof(key)!="undefined"){
if(this.contains(key)==false){
this._hash[key]=typeof(value)=="undefined"?null:value;
return true;
} else {
return false;
}
} else {
return false;
}
}
this.remove = function(key){delete this._hash[key];}
this.count = function(){var i=0;for(var k in this._hash){i++;} return i;}
this.items = function(key){return this._hash[key];}
this.contains = function(key){return typeof(this._hash[key])!="undefined";}
this.clear = function(){for(var k in this._hash){delete this._hash[k];}}

}

//字符串转换为哈希表
this.str2hashtable = function(key,cs){

var _key = key.split(/,/g);
var _hash = new Hashtable();
var _cs = true;


if(typeof(cs)=="undefined"||cs==null){
_cs = true;
} else {
_cs = cs;
}

for(var i in _key){
if(_cs){
_hash.add(_key[i]);
} else {
_hash.add((_key[i]+"").toLowerCase());
}

}
return _hash;
}

this._hideCols = this.str2hashtable("");
this._hideRows = this.str2hashtable("");

this.hideCols = function(cols){
me._hideCols = me.str2hashtable(cols)
}

this.isHideCols = function(val){
return me._hideCols.contains(val);
}

this.hideRows = function(rows){
me._hideRows = me.str2hashtable(rows)
}

this.isHideRows = function(val){
return me._hideRows.contains(val);
}

this.afterPrint = function()
{
var table = me.content;

if(typeof(me.board)=="undefined"||me.board==null){
me.board = document.getElementById("divPrint");
if(typeof(me.board)=="undefined"||me.board==null){
me.board = document.createElement("div");
document.body.appendChild(me.board);
}
}

if(typeof(table)!="undefined"){
for(var i =0;i<table.rows.length;i++){
var tr = table.rows[i];
for(var j=0;j<tr.cells.length;j++){
if(me.isHideCols(j)){
tr.cells[j].style.display = "";
}
}
}
}

me.content.style.display = '';
me.header.style.display = '';
me.footer.style.display = '';
me.board.innerHTML = '';

}

this.beforePrint = function(){

var table = me.content;

if(typeof(me.board)=="undefined"||me.board==null){
me.board = document.getElementById("divPrint");
if(typeof(me.board)=="undefined"||me.board==null){
me.board = document.createElement("div");
document.body.appendChild(me.board);
}
}


if(typeof(table)!="undefined"&&this.hideCols.length>0){

for(var i =0;i<table.rows.length;i++){
var tr = table.rows[i];
for(var j=0;j<tr.cells.length;j++){
if(me.isHideCols(j)){
tr.cells[j].style.display = "none";
}
}
}
}


///开始分页
var pageSize = this.pageSize;

var head = me.header;
var foot = me.footer;

var page = new Array();
var rows = "";
var rowIndex= 1;

var cp = 0;
var tp = 0;


for(i=1;i<table.rows.length;i++){
if(this.isHideRows(i)==false){
if((((rowIndex-1)%pageSize)==0&&rowIndex>1)||i==table.rows.length){
page[page.length] = getTable(head,table,rows,foot);

rows = getOuterHTML(table.rows[i]) + "\n" ;
rowIndex= 2;

} else {
rows += getOuterHTML(table.rows[i]) + "\n";
rowIndex++;
}
}
}

if(rows.length>0){
page[page.length] = getTable(head,table,rows,foot);
}

tp = page.length;

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);
}


head.style.display = 'none';
foot.style.display = 'none';
table.style.display = 'none';

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);
}

htm += "\n<div class='pageNext'></div>"

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"><font size='6' face='楷体_gb2312'>元件列表</font></td>
</tr>
<tr>
<td><strong>日期:2005年12月12日</strong></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><span class="text2"><nobr>
贴片电路
</nobr></span>
</td>
<td>
<span class="text1" title='ADE7755 63 7'>
<nobr>
ADE7755ARS
</nobr></span>
</td>
<td align="center">ADI</td>
<td align="right">1000</td>
<td width="125"><span class="text1" title ='世健国际贸易(上海)有限公司'><nobr>世健国际贸易(上海)有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电容
</nobr></span>
</td>
<td>

<span class="text1" title='CC0805 0.1μ 168 7'>
<nobr>
C2012X7R1H104KT
</nobr></span>
</td>
<td align="center">TDK</td>
<td align="right">8000</td>
<td width="125"><span class="text1" title ='南京商络电子有限公司'><nobr>南京商络电子有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电容
</nobr></span>
</td>
<td>

<span class="text1" title='CC0805 20p 162 7'>
<nobr>
C2012COG1H200JT
</nobr></span>
</td>
<td align="center">TDK</td>
<td align="right">2000</td>
<td width="125"><span class="text1" title ='南京商络电子有限公司'><nobr>南京商络电子有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电容
</nobr></span>
</td>
<td>

<span class="text1" title='CC0805 33N 765 7'>
<nobr>
C2012X7R1H333KT
</nobr></span>
</td>
<td align="center">TDK</td>
<td align="right">4000</td>
<td width="125"><span class="text1" title ='南京商络电子有限公司'><nobr>南京商络电子有限公司</nobr></span></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>
<span class="text2"><nobr>
压敏电阻
</nobr></span>
</td>
<td>

<span class="text1" title='MY20K681 186 7'>
<nobr>
GND20D681K
</nobr></span>
</td>
<td align="center">中普</td>
<td align="right">1000</td>
<td width="125"><span class="text1" title ='苏州中普电子有限公司'><nobr>苏州中普电子有限公司</nobr></span></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>
<span class="text2"><nobr>
晶振
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
HC-49U/S 3.579545MHz 20pf 带垫片
</nobr></span>
</td>
<td align="center">海创</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>武汉海创电子有限公司</nobr></span></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>
<span class="text2"><nobr>
安规电容
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
275V-X2-0.47μF
</nobr></span>
</td>
<td align="center">昱电</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海昱电电子有限公司</nobr></span></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>
<span class="text2"><nobr>
电解电容
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
CD112 16V 33μF
</nobr></span>
</td>
<td align="center">Samyoung</td>
<td align="right">2000</td>
<td width="125"><span class="text1"><nobr>上海文得贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
电解电容
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
CD112S 16V 220μF
</nobr></span>
</td>
<td align="center">Samyoung</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海文得贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
电解电容
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
CD112S 35V 470μF
</nobr></span>
</td>
<td align="center">Samyoung</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海文得贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
插件电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RSF2BJ 470Ω
</nobr></span>
</td>
<td align="center">KOA</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海凡元电子有限公司</nobr></span></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>
<span class="text2"><nobr>
发光二极管
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
L-314LRC-A-SS
</nobr></span>
</td>
<td align="center">HUADING</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海沪鼎电子有限公司</nobr></span></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>
<span class="text2"><nobr>
插件二、三极管
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
1N4744A
</nobr></span>
</td>
<td align="center">MCC</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>励智电子(上海)有限公司</nobr></span></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>
<span class="text2"><nobr>
磁珠
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
B62
</nobr></span>
</td>
<td align="center">JONES</td>
<td align="right">2000</td>
<td width="125"><span class="text1"><nobr>北京中石伟业技术有限公司</nobr></span></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>
<span class="text2"><nobr>
晶振
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
CFS206 32.768kHz 20ppm/12.5pf
</nobr></span>
</td>
<td align="center">CITIZEN</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海创邦国际贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-071K2
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805FR-071K2
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">2000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-0710R
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-0710K
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-07150K
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805FR-071K
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">2000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-072K4
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-0720K
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-072K
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-07390K
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">3000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-0739K
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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>
<span class="text2"><nobr>
贴片电阻
</nobr></span>
</td>
<td>

<span class="text1">
<nobr>
RC0805JR-074K7
</nobr></span>
</td>
<td align="center">YAGEO</td>
<td align="right">1000</td>
<td width="125"><span class="text1"><nobr>上海衡谦贸易有限公司</nobr></span></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><!--ct--></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>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值