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>