JavaScript melaksanakan pencetakan langsung dengan mengklik kemahiran button

JavaScript melaksanakan pencetakan langsung dengan mengklik kemahiran button_javascript

WBOY

Lepaskan： 2016-05-16 15:21:26

asal

1952 orang telah melayarinya

Banyak laman web mempunyai fungsi ini Apabila anda menyemak imbas ke bahagian bawah, akan ada butang cetak Klik butang cetak untuk menyelesaikan fungsi cetakan.

<a href="javascript:window.print()">脚本之家</a>

Salin selepas log masuk

Iaitu, panggil sahaja fungsi window.print() untuk mencetak halaman semasa.

Tetapi perkara di atas tidak sempurna, kerana banyak kandungan pada sesetengah halaman web tidak perlu dicetak Berikut ialah cara mencetak kandungan yang ditentukan pada halaman tersebut.

Kod adalah seperti berikut:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>指定被打印的内容</title>
<script language="javascript"> 
function printdiv(printpage) 
{ 
var newstr = printpage.innerHTML; 
var oldstr = document.body.innerHTML; 
document.body.innerHTML =newstr; 
window.print(); 
document.body.innerHTML=oldstr; 
return false; 
} 
window.onload=function()
{
var bt=document.getElementById("bt");
var div_print=document.getElementById("div_print");
bt.onclick=function()
{
printdiv(div_print);
}
}
</script> 
</head> 
<body> 
<div id="div_print"> 
<h1 style="Color:Red">这是要被打印的内容</h1> 
</div>
<div style="Color:Red">欢迎您</div> 
<input name="print" type="button" id="bt" value="点击打印" /> 
</body> 
</html>

Salin selepas log masuk

Nota khas: Pratonton cetakan memerlukan penyalinan kod ke mesin tempatan untuk ujian, jika tidak, ralat akan berlaku.

Kod di atas menyedari kesan mencetak kandungan halaman web yang ditentukan Berikut adalah pengenalan ringkas kepada proses pelaksanaan.

1. Prinsip pelaksanaan:

Gunakan document.body.innerHTML =newstr dalam kod js untuk menggantikan kandungan dalam badan asal secara dinamik dengan kandungan yang akan dicetak, pulihkan kandungan asalnya. Untuk butiran, sila rujuk komen kod.

2. Kod ulasan:

1.function printdiv(printpage){}, mengisytiharkan fungsi yang mengawal pencetakan Parameter ialah objek dan kandungan dalam objek ini akan dicetak.
2.var newstr = printpage.innerHTML;
3.var oldstr = document.body.innerHTML, kandungan dalam badan asal.
4. document.body.innerHTML =newstr, gantikan kandungan dalam badan asal dengan kandungan yang akan dicetak.
5.window.print(), mula mencetak.
6.document.body.innerHTML=oldstr, dan kemudian pulihkan kandungan dalam kandungan asal.

3. Bacaan berkaitan:

1. Untuk fungsi window.print(), sila rujuk bab Kaedah print() bagi objek tetingkap.
2. Untuk acara onclick, sila rujuk bab javascript onclick event.

Kandungan di atas agak mudah, dan terdapat ulasan kod yang berasingan untuk membantu anda mempelajari js untuk melaksanakan fungsi pencetakan dengan mengklik butang saya harap artikel ini akan membantu semua orang.