在HTML網頁上打印需要的內容,JS代碼
通常在瀏覽網頁的時候,網頁上總是出現一些和內容無關的內容,在打印的時候,要是把整個網頁都打印下來,總會有些不方便。。。所以在有需要打印的網頁上稍微設置一下打印頁是很有必要的。。。
首先在head里面加入下面一段js代碼:
---------------------------------------------
<script language="javascript">
function preview(oper)
{
if (oper < 10){
bdhtml=window.document.body.innerHTML;/ /獲取當前頁的html代碼
sprnstr="<!--startprint"+oper+"-->";/ /設置打印開始區域
eprnstr="<!--endprint"+oper+"-->";/ /設置打印結束區域
prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); / /從開始代碼向后取html
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));/ /從結束代碼向前取html
window.document.body.innerHTML=prnhtml;
window.print();
window.document.body.innerHTML=bdhtml;
} else {
window.print();
}
}
</script>
---------------------------------------------
然后在所需要打印的代碼,用<!--startprint1-->和<!--endprint1-->包圍着,如下:
---------------------------------------------
<!--startprint1-->
<!--打印內容開始-->
<div id=sty>
...
</div>
<!--打印內容結束-->
<!--endprint1-->
---------------------------------------------
最后加上一個打印的按鈕
<input type=button name='button_export' title='打印1' onclick=preview(1) value=打印1>
---------------------------------------------
另外說明一下,在一個HTML頁面里面,可以設置多個打印區域,需要改動一下的就只是幾個數字就OK了。如:
在選擇第二個區域里面時用<!--startprint2--><!--endprint2-->包圍着,而按鈕自然也改成對應的preview(1)了。這樣第二區域的打印就完成。
還有一點,就是CSS樣式表的問題了,打印的效果是不包含背景的打印的,設置是注意一下。<style media="print">、<link media="print">的用法合理應用,media="print"是不被網頁所顯示的,只能在打印的效果上存在,可以設置出打印效果和在網頁上所顯示的不一樣。
