HTML 網頁程式列印頁面指定範圍區域
HTML 網頁程式設計,要列印頁面中的指定範圍區塊,加入以下 javascript 語法,及用 <div id="js設定名稱"> 將要列印的指定範圍區塊包起來,再設個列印連結,即可開新頁面顯示指定範圍區塊內容供您列印了。範例程式碼如下,供參考之:主要為紅色字部份
<html>
<head>
<meta charset="utf-8">
<title>HTML 網頁程式列印頁面指定範圍區域</title> <script>
//範圍列印
function printScreen(block){
var value = block.innerHTML;
var printPage = window.open("","printPage","");
printPage.document.open();
printPage.document.write("<OBJECT classid='CLSID:8856F961-340A-11D0-A96B-00C04FD705A2' height=0 id=wc name=wc width=0></OBJECT>"); //和下一行是跳出預覽列印,僅適用IE
printPage.document.write("<HTML><head></head><BODY onload='javascript:wc.execwb(7,1);window.close()'>");
printPage.document.write("<HTML><head></head><BODY onload='window.print();window.close()'>");
printPage.document.write(value);
printPage.document.close("</BODY></HTML>");
}
</script>
</head>
<body>
<div><button onclick="printScreen(block)">按我看指定範圍列印頁</button></div> <p>以下為指定列印範圍區域:</p> <div id="block"> ★喵喵笨兔 の 喵喵的家~遊戲天地★
◇主站 (PHP版):
(1) http://vv0817.tk
(2) http://vvv.lionfree.net
(3) http://qo3op.asuscomm.com/vvv
(4) http://victortu.000webhostapp.com
◇主站 (HTML版):
(1) http://qo3op.asuscomm.com/vvv1
(2) https://uoedgpkhyfwzmd7zua8myg-on.drv.tw/vvv
◇FB粉絲團:https://www.facebook.com/vvv.myweb.hinet.net
◇Google Blog:https://vvmyblog.blogspot.com
◇Xuite Blog:https://blog.xuite.net/dsl0817/blog
◇希望 Online 資訊站:
(1) http://qo3op.asuscomm.com/seal
(2) https://uoedgpkhyfwzmd7zua8myg-on.drv.tw/seal </div>
</body>
</html>
範例結果:
以下為指定列印範圍區域: