1. 程式人生 > >javascript實現列印指定區域的內容

javascript實現列印指定區域的內容

今天閒來無事,就參考度孃的搜尋結果,寫出了這個用javascript實現列印指定區域內容的程式碼,僅供參考:

HTML程式碼:

<!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=utf-8" />

<meta http-equiv="Expires" content="0">

<meta http-equiv="Pragma" content="no-cache">

<meta http-equiv="Cache-control" content="no-cache">

<meta http-equiv="Cache" content="no-cache">

<meta name="keywords" content="" />

<meta name="description" content="" />

<script type="text/javascript" src="/js/jquery-min.js">

</script><script type="text/javascript" src="/js/fun.js">

</script><link type="text/css" rel="stylesheet" href="/css/style.css" />

<title></title>

</head>

<body>

……

<input type="button" name="printBut" value="列印" onClick="webPrint('sholdPrint')" />

<!--需要列印的內容-->

<div id="sholdPrint">

  這裡放置需要列印的內容

</div>

……

</body>

</html>

對應列印的JAVASCRIPT程式碼:

<script type="text/javascript">



//列印
function webPrint(objId){
var printContent=document.getElementById(objId).innerHTML;//獲得需要列印內容的HTML程式碼
PageSetup_Null();//清空頁首頁尾
printWindow=window.open('','_blank','width=500,height=300,location=0,menubar=0,status=0,toolbar=0,scrollbars=1');
printWindow.document.write('<!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=utf-8" /><meta http-equiv="Expires" content="0"><meta http-equiv="Pragma" content="no-cache"><meta http-equiv="Cache-control" content="no-cache"><meta http-equiv="Cache" content="no-cache"><meta name="keywords" content="" /><meta name="description" content="" /><script type="text/javascript" src="/js/jquery-min.js"></script><script type="text/javascript" src="/js/fun.js"></script><link type="text/css" rel="stylesheet" href="/css/style.css" /><title></title></head><body>');//這裡是向新建的視窗寫入HTML的head資訊,可引入自己的js和css,以供列印時樣式與網頁中顯示的一致
printWindow.document.write('<div style="width:100%; height:100%; overflow:hidden;">'+printContent+"</div>");//這裡向新建的窗體中寫入BODY的內容,注意,外邊加的額外DIV是有必要的,它裡面CSS可以控制列印時不會出現空白頁
printWindow.document.write("</body></html>");//這裡向新建的窗體寫入HTML的結束標記
printWindow.focus();//當前新建的視窗獲得焦點
printWindow.document.close();//關閉新建視窗的文件輸出流,這個是必須的,否則下面的列印語句無效
printWindow.print();//列印當前新建視窗中的內容
printWindow.close();//關閉新建的視窗
PageSetup_Default();//把頁首頁尾恢復為預設
}
//設定網頁列印的頁首頁尾為空
function PageSetup_Null()
{
var HKEY_Root,HKEY_Path,HKEY_Key;
HKEY_Root="HKEY_CURRENT_USER";
HKEY_Path="\\Software\\Microsoft\\Internet Explorer\\PageSetup\\";
try{
var Wsh=new ActiveXObject("WScript.Shell");
HKEY_Key="header";
Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"");
HKEY_Key="footer";
Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"");
}catch(e){}
}
//設定網頁列印的頁首頁尾為預設值
function PageSetup_Default()
{
var HKEY_Root,HKEY_Path,HKEY_Key;
HKEY_Root="HKEY_CURRENT_USER";
HKEY_Path="\\Software\\Microsoft\\Internet Explorer\\PageSetup\\";
try{
var Wsh=new ActiveXObject("WScript.Shell");
HKEY_Key="header";
Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&w&b頁碼,&p/&P");
HKEY_Key="footer";
Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&u&b&d");
}catch(e){}
}

</script>