`
Luob.
  • 浏览: 1590355 次
  • 来自: 上海
社区版块
存档分类
最新评论

js 打印

阅读更多
js web页面打印
//关键的就下面两行 会用就行了
<style type="text/css" media=print>  
.noprint{display : none }  

//下面的不用看
</style>

onclick="window.print()";


//写的一个例子
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="../css/style.css" rel="stylesheet" type="text/css">
<title>_______________________________________________________________________________________________________________________</title>
<script src="/bjproduct/js/jquery-latest.js"></script>
<style type="text/css" media=print>  
.noprint{display : none }  
</style>
<style type="text/css">
.printtable TD{
padding: 1px 5px 1px 5px;
border: 1px #000000 solid;
font-size: 13px;
font-family: Arial, Helvetica, sans-serif;
line-height: 140%;
text-align: center;
}
.printtable TR{
	height:25px;
}
.printtable .title{
background-color: #DFDFDF;
min-width: 80px;
}
</style>
</head>
<body topmargin="0" leftmargin="0">
<table border="0" cellpadding="0" cellspacing="0" width="100%" align="center">
<tr class="noprint">
	<td>
		<table width="100%" border="0" cellspacing="0" cellpadding="0">
		<tr><td height=5></td></tr>
		<tr><td width=35>&nbsp;&nbsp;<img src="/bjproduct/images/icon_winpop.gif"></td>
		<td style="font-size:13px; font-weight:bold">
         	 财务管理 &gt;&gt;打款申请查询&gt;&gt;
				打印申请单
		</td>
		</tr>
		<tr><td colspan=2 >
		<table border=0 width=99% align=center cellpadding=0 cellspacing=0><tr><td height=1 bgcolor=#cccccc></td></tr></table>
		</td></tr></table>	
	</td>
</tr>
<tr><td valign="top" align="center" height="100%">
	<div class="noprint" align="left" style="padding:20 0 5 100px"><input id="biuuu_button"  class="button_blue" onclick="window.print();" type="button" value="打印"></input>  </div>
	<div id="printConent">
	
	
		 
			<table width="80%" bordercolorlight="#cccccc" align="center" bordercolordark="#cccccc" cellspacing="0">
				<thead align="center">
				<tr style="height: 55px;">
					<td colspan="6" style="padding-top:10px; margin:0px;"><h1>打款申请单</h1></td>
				</tr>
				</thead>
				<tr>
					<td style="min-width: 80px;">申请单号:</td>
					<td>PAY20130820161727</td>
					<td>申请日期:</td>
					<td>2013/08/20 16:18</td>
					<td>申请人:</td>
		 			<td>luobb</td>	
				</tr>
			</table>
			<table border="1" class="printtable" width="80%" bordercolorlight="#cccccc" align="center" bordercolordark="#cccccc" cellspacing="0">	
				<tbody cellspacing="0">
				<tr>
					<td class="title">收款单位</td>
					<td colspan="2">我的招商</td>	
					<td class="title">收款单位</td>
					<td colspan="2">21065461</td>
				</tr>
				<tr>
					<td class="title">付款账户</td>
					<td colspan="2">63369006345682234</td>	
					<td class="title">付款时间</td>
					<td colspan="2">&nbsp;</td>
				</tr>
				<tr>
					<td class="title">金额(小写)</td>
					<td colspan="2">&yen;1,000.00</td>	
					<td class="title">金额(大写)</td>
					<td style="text-align: left;" colspan="2" name="uppercase" id="com.bjdata.bjproduct.persistence.finance.model.BiFinancePay@59b30ac0" money="1000.0"></td>
				</tr>
				<tr style="height:40px;">
					<td class="title" >打款用途</td>
					<td colspan="5" style="text-align: left;">&nbsp;买棉花糖</td>	
				</tr>
				<tr>
					<td rowspan="4" class="title">审批记录</td>
					<td class="title">审批人</td>
					<td class="title">审批结果</td>
					<td colspan="2" class="title">审批意见</td>
					<td class="title">审批时间</td>
				</tr>
				 
					<tr>
					<td>陈ll</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;行啊</td>
					<td>
					2013/08/20 16:19
					</td>
					</tr>
				 
					<tr>
					<td>余xx</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;打款好了</td>
					<td>
					2013/08/20 16:20
					</td>
					</tr>
				 
					<tr>
					<td>肖qq</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;通过</td>
					<td>
					2013/08/20 16:21
					</td>
					</tr>
				
			</table>
			
				<br/>
				<hr style="border: 1px dotted #000000;"/>
			
		 
			<table width="80%" bordercolorlight="#cccccc" align="center" bordercolordark="#cccccc" cellspacing="0">
				<thead align="center">
				<tr style="height: 55px;">
					<td colspan="6" style="padding-top:10px; margin:0px;"><h1>打款申请单</h1></td>
				</tr>
				</thead>
				<tr>
					<td style="min-width: 80px;">申请单号:</td>
					<td>PAY20130820153935</td>
					<td>申请日期:</td>
					<td>2013/08/20 15:40</td>
					<td>申请人:</td>
		 			<td>luobb</td>	
				</tr>
			</table>
			<table border="1" class="printtable" width="80%" bordercolorlight="#cccccc" align="center" bordercolordark="#cccccc" cellspacing="0">	
				<tbody cellspacing="0">
				<tr>
					<td class="title">收款单位</td>
					<td colspan="2">是非得失</td>	
					<td class="title">收款单位</td>
					<td colspan="2">阿飞斯蒂芬</td>
				</tr>
				<tr>
					<td class="title">付款账户</td>
					<td colspan="2">256568164@qq.com</td>	
					<td class="title">付款时间</td>
					<td colspan="2">&nbsp;</td>
				</tr>
				<tr>
					<td class="title">金额(小写)</td>
					<td colspan="2">&yen;300.00</td>	
					<td class="title">金额(大写)</td>
					<td style="text-align: left;" colspan="2" name="uppercase" id="com.bjdata.bjproduct.persistence.finance.model.BiFinancePay@7986f141" money="300.0"></td>
				</tr>
				<tr style="height:40px;">
					<td class="title" >打款用途</td>
					<td colspan="5" style="text-align: left;">&nbsp;收复失地</td>	
				</tr>
				<tr>
					<td rowspan="4" class="title">审批记录</td>
					<td class="title">审批人</td>
					<td class="title">审批结果</td>
					<td colspan="2" class="title">审批意见</td>
					<td class="title">审批时间</td>
				</tr>
				 
					<tr>
					<td>陈吕祥</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;统一</td>
					<td>
					2013/08/20 15:40
					</td>
					</tr>
				 
					<tr>
					<td>余秀丽</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;统一</td>
					<td>
					2013/08/20 15:41
					</td>
					</tr>
				 
					<tr>
					<td>肖秋霞</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;统一</td>
					<td>
					2013/08/20 15:43
					</td>
					</tr>
				
			</table>
			
				<br/>
				<hr style="border: 1px dotted #000000;"/>
			
		 
			<table width="80%" bordercolorlight="#cccccc" align="center" bordercolordark="#cccccc" cellspacing="0">
				<thead align="center">
				<tr style="height: 55px;">
					<td colspan="6" style="padding-top:10px; margin:0px;"><h1>打款申请单</h1></td>
				</tr>
				</thead>
				<tr>
					<td style="min-width: 80px;">申请单号:</td>
					<td>PAY20130820110938</td>
					<td>申请日期:</td>
					<td>2013/08/20 11:10</td>
					<td>申请人:</td>
		 			<td>luobb</td>	
				</tr>
			</table>
			<table border="1" class="printtable" width="80%" bordercolorlight="#cccccc" align="center" bordercolordark="#cccccc" cellspacing="0">	
				<tbody cellspacing="0">
				<tr>
					<td class="title">收款单位</td>
					<td colspan="2">161231</td>	
					<td class="title">收款单位</td>
					<td colspan="2">admin</td>
				</tr>
				<tr>
					<td class="title">付款账户</td>
					<td colspan="2">63369006345682234</td>	
					<td class="title">付款时间</td>
					<td colspan="2">&nbsp;</td>
				</tr>
				<tr>
					<td class="title">金额(小写)</td>
					<td colspan="2">&yen;200.00</td>	
					<td class="title">金额(大写)</td>
					<td style="text-align: left;" colspan="2" name="uppercase" id="com.bjdata.bjproduct.persistence.finance.model.BiFinancePay@a4920bc" money="200.0"></td>
				</tr>
				<tr style="height:40px;">
					<td class="title" >打款用途</td>
					<td colspan="5" style="text-align: left;">&nbsp;高温补贴</td>	
				</tr>
				<tr>
					<td rowspan="4" class="title">审批记录</td>
					<td class="title">审批人</td>
					<td class="title">审批结果</td>
					<td colspan="2" class="title">审批意见</td>
					<td class="title">审批时间</td>
				</tr>
				 
					<tr>
					<td>陈吕祥</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;同意</td>
					<td>
					2013/08/20 11:11
					</td>
					</tr>
				 
					<tr>
					<td>余秀丽</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;打款了</td>
					<td>
					2013/08/20 14:02
					</td>
					</tr>
				 
					<tr>
					<td>肖秋霞</td>
					<td>
						
							
								同意
							
							
							
						
					</td>
					<td colspan="2" style="text-align: left;">&nbsp;通过</td>
					<td>
					2013/08/20 14:03
					</td>
					</tr>
				
			</table>
			
		
		</div>
	</td></tr>
</table>
<script type="text/javascript"> 
$(function(){
	$(".printtable td:[name='uppercase']").each(function(index,ele){
		var money=$(ele).attr("money");
		money=chineseNumber(money);
		$(ele).text(money);
	});
});

function chineseNumber(num)
{
	if (isNaN(num) || num > Math.pow(10, 12)) return ""
	var cn = "零壹贰叁肆伍陆柒捌玖"
	var unit = new Array("拾百千", "分角")
	var unit1= new Array("万亿", "")
	var numArray = num.toString().split(".")
	var start = new Array(numArray[0].length-1, 2)
	function toChinese(num, index)
	{
		var num = num.replace(/\d/g, function ($1)
		{
			return cn.charAt($1)+unit[index].charAt(start--%4 ? start%4 : -1)
		})
		return num
	}
	for (var i=0; i<numArray.length; i++)
	{
		var tmp = ""
		for (var j=0; j*4<numArray[i].length; j++)
		{
		var strIndex = numArray[i].length-(j+1)*4
		var str = numArray[i].substring(strIndex, strIndex+4)
		var start = i ? 2 : str.length-1
		var tmp1 = toChinese(str, i)
		tmp1 = tmp1.replace(/(零.)+/g, "零").replace(/零+$/, "")
		tmp1 = tmp1.replace(/^壹拾/, "拾")
		tmp = (tmp1+unit1[i].charAt(j-1)) + tmp
		}
		numArray[i] = tmp
	}
	numArray[1] = numArray[1] ? numArray[1] : ""
	numArray[0] = numArray[0] ? numArray[0]+"元" : numArray[0], numArray[1] = numArray[1].replace(/^零+/, "")
	numArray[1] = numArray[1].match(/分/) ? numArray[1] : numArray[1]+"整"
	return numArray[0]+numArray[1]
}


</script>
</body>
</html>


分享到:
评论

相关推荐

    原生JS打印插件之jQuery.EasyPrint.js使用文档

    javascript打印大全;通用;js实现打印的方式;JS怎么实现页面打印呢?JavaScript 实现打印,打印预览,打印设置;JS打印和报表输出;原生js打印插件Print.js;js控制分页打印、打印分页示例;js 打印插件;js使用...

    用Javascript打印网页指定标签的内容

    用Javascript打印网页指定标签的内容 用Javascript打印网页指定标签的内容是指在网页上选择指定的标签,然后将其内容导出到另一个页面上,最后进行打印的操作。这种方法可以灵活地控制打印的内容和格式。下面将详细...

    通过调用 JS 打印图片信息

    "通过调用 JS 打印图片信息"这个主题就是针对这一需求展开的。本文将深入探讨如何利用 JavaScript 实现这一功能,特别是在解决谷歌浏览器首次打印时图片不显示及去除IE浏览器页眉页脚的问题。 首先,我们需要理解为...

    javascript,js打印

    在JavaScript(JS)中,打印功能是通过与浏览器的交互来实现的,允许用户将网页内容或者特定元素发送到打印机。这个过程涉及到一系列的技术和方法,包括DOM操作、CSS样式控制以及利用JavaScript库如jQuery来简化操作...

    Js打印功能,支持局部打印

    "Js打印功能,支持局部打印"这一主题,主要涉及的是JavaScript在网页中实现打印的功能,特别是如何实现对特定区域(局部)的打印。 JavaScript是一种广泛用于网页开发的脚本语言,它可以直接在用户的浏览器上运行,...

    JS打印报表控件

    "JS打印报表控件"是专门为JavaScript设计的一种工具,它允许开发者在Web应用中实现报表的打印功能,包括分页打印和打印预览,从而提供更丰富的用户体验。 在Web开发中,打印功能通常是必不可少的,尤其是对于那些...

    js 打印以及预览功能实现

    在JavaScript(js)中实现打印和预览功能是一项常见的需求,尤其在Web开发中。本文将详细介绍如何基于JavaScript实现这一功能,并确保其在IE、Firefox和Google等主流浏览器中的兼容性。 首先,我们需要理解...

    工具-打印:js打印插件

    "工具-打印:js打印插件"的标题暗示了我们将在讨论如何利用JavaScript来创建或集成一个打印插件,以便用户能够方便地打印网页中的特定部分,同时确保该功能在不同的浏览器环境下具有良好的兼容性。 **JS打印插件的...

    js 打印控件

    “lodop47”可能是一个名为LODOP的JavaScript打印服务程序的版本,它是一个跨浏览器的打印解决方案。LODOP通过在客户端提供一个对象,使得开发者可以调用一系列方法来控制打印过程,如设置页面布局、选择打印机、...

    javascript打印如何自定义纸张大小(代码)[借鉴].pdf

    JavaScript 打印自定义纸张大小 本文档讨论了使用 JavaScript 实现自定义纸张大小的打印方法,并解决了页脚、页眉、横向和纵向的问题。同时,本文还介绍了使用 IE 的 WebBrowser控件来实现打印预览和设置打印纸张...

    js 打印插件

    JavaScript打印插件是一种用于网页打印和预览的技术,它基于JavaScript语言,允许用户在不离开当前页面的情况下进行打印操作。这种技术广泛应用于各种浏览器环境中,包括IE、Firefox和Chrome等主流浏览器,为用户...

    js打印WEB页面与打印预览

    JS打印WEB页面与打印预览是指在WEB页面中使用JavaScript语言来实现页面的打印和预览功能。以下是实现这个功能的三种方法: 第一种方法:使用CSS隐藏不打印内容 在这个方法中,我们可以使用CSS来隐藏不需要打印的...

    js打印实现各个浏览器预览插件

    总结来说,实现跨浏览器的JS打印预览功能,需要考虑不同浏览器的特性,如IE的ActiveXObject,以及利用jQuery插件来提供统一的用户体验。`jquery-print-preview-plugin`这类插件简化了这一过程,提供了丰富的定制选项...

    js打印excel文档,打印table

    总结来说,使用JavaScript打印HTML中的table并将其导出为Excel文档,需要结合jQuery、printArea插件以及可能的FileSaver.js库。通过DOM操作获取表格数据,转换成CSV格式,再创建并保存为Excel文件。这种方法在前端...

    js打印设置页边距

    在JavaScript中实现对打印页面的定制化设置,如页边距、页眉和页脚的配置,是一项进阶技能,尤其对于需要精确控制打印输出的Web应用而言至关重要。本文将深入探讨如何使用JavaScript来调整打印时的页边距,设置或...

    JS打印页面代码JS打印页面代码

    JS打印页面代码JS打印页面代码JS打印页面代码JS打印页面代码JS打印页面代码JS打印页面代码JS打印页面代码

    JS打印的几种实现方法

    JavaScript打印功能需要注意不同浏览器之间的差异,确保在所有主流浏览器(如Chrome、Firefox、Safari、IE/Edge)下都能正常工作。 9. **性能优化**: 在大量数据或者复杂页面结构的情况下,优化打印性能,比如...

    js打印文件,一个WEB打印的JS脚本

    一个WEB打印的JS脚本,支持WEB程序开发,可实现WEB页面直接打印。

    Lodpo6.0js打印组件

    Lodop6.0js打印组件是一款高效且功能丰富的JavaScript打印解决方案,专为网页开发者设计,以满足在浏览器环境中进行多样化的打印需求。这个组件能够帮助开发者轻松地实现在网页上进行打印预览、局部打印以及自定义...

    好用的JS打印指定区域

    "好用的JS打印指定区域"这个主题聚焦于如何利用jQuery库来高效地实现网页特定部分的打印功能。jQuery,作为一个广泛使用的JavaScript库,提供了简洁的API,使得开发者可以更加便捷地操作DOM元素,包括对页面区域的...

Global site tag (gtag.js) - Google Analytics