快捷導(dǎo)航

javascript 局部頁(yè)面打印實(shí)現(xiàn)代碼

更新時(shí)間：2009年08月09日 01:13:36 作者：

Web打印有很多方式，水晶報(bào)表使用的恐怕比較多，但這東西是收費(fèi)軟件，老板說(shuō)不能用:(。

ie自帶的有Active控件，但火狐不支持。這里使用的是js操作dom方法對(duì)窗體指定標(biāo)記內(nèi)文字進(jìn)行打印，所以使用時(shí)需要定義相關(guān)的標(biāo)簽及其樣式（文字大小、字體之類）。

復(fù)制代碼代碼如下:

<script type="text/javascript"> 
///*********************** 
///打印指定區(qū)域頁(yè)面 
///說(shuō)明：obj–通過(guò)getElementById或其它方式獲取標(biāo)簽標(biāo)識(shí)，打印此obj內(nèi)的文字 
///日期：2009-8-7 
function startPrint(obj) 
{ 
var oWin=window.open("","_blank"); 
var strPrint="<h4 style='font-size:18px; text-align:center;'>打印預(yù)覽區(qū)</h4>\n"; 

strPrint=strPrint + "<script type=\"text/javascript\">\n"; 
strPrint=strPrint + "function printWin()\n"; 
strPrint=strPrint + "{"; 
strPrint=strPrint + "var oWin=window.open(\"\",\"_blank\");\n"; 
strPrint=strPrint + "oWin.document.write(document.getElementById(\"content\").innerHTML);\n"; 
strPrint=strPrint + "oWin.focus();\n"; 
strPrint=strPrint + "oWin.document.close();\n"; 
strPrint=strPrint + "oWin.print()\n"; 
strPrint=strPrint + "oWin.close()\n"; 
strPrint=strPrint + "}\n"; 
strPrint=strPrint + "<\/script>\n"; 

strPrint=strPrint + "<hr size='1′ />\n"; 
strPrint=strPrint + "<div id=\"content\">\n"; 
strPrint=strPrint + obj.innerHTML + "\n"; 
strPrint=strPrint + "</div>\n"; 
strPrint=strPrint + "<hr size='1′ />\n"; 
strPrint=strPrint + "<div style='text-align:center'><button onclick='printWin()' style='padding-left:4px;padding-right:4px;'>打 印</button><button onclick='window.opener=null;window.close();' style='padding-left:4px;padding-right:4px;'>關(guān) 閉</button></div>\n"; 
oWin.document.write(strPrint); 
oWin.focus(); 
oWin.document.close(); 
} 
</script> 

<button id="btnPrint" onclick="startPrint(document.getElementById('content'))">打印內(nèi)容</button> 
<div id="content"> 
<div style="font-size:12px;color:#333;"> 
這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容 
</div> 
</div>

下面是測(cè)試代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>打印指定區(qū)域頁(yè)面</title> <style type="text/css"> body{ font-size:12px; color:#333; } #content{ border:solid 1px #333; background:#ffc; } </style>  </head> <body> <button id="btnPrint" onclick="startPrint(document.getElementById('content'))">打印內(nèi)容</button> <div   class="wppm3vysvbp"   id="content">     <div style="font-size:12px;color:#333;">     這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容這里是打印內(nèi)容     </div> </div> </body> </html>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

您可能感興趣的文章: