Rumah > hujung hadapan web > tutorial js > kaedah window.print untuk mencetak kawasan tertentu halaman web tertentu dalam kemahiran div_javascript tertentu

kaedah window.print untuk mencetak kawasan tertentu halaman web tertentu dalam kemahiran div_javascript tertentu

WBOY
Lepaskan: 2016-05-16 16:40:29
asal
1699 orang telah melayarinya

Kaedah pertama: nyatakan kawasan bukan pencetakan
Gunakan CSS untuk mentakrifkan kelas .noprint dan letakkan kandungan tidak boleh cetak ke dalam kelas ini.
Butiran adalah seperti berikut:

<style media=print type="text/css"> 
.noprint{visibility:hidden} 
</style>
Salin selepas log masuk

Kandungan untuk dicetak. Ha ha!

<p class="noprint">将不打印的代码放在这里。</p> 
<a href="javascript:window.print()" rel="external nofollow" target="_self">打印</a>
Salin selepas log masuk

Kaedah kedua: nyatakan kawasan pencetakan
Letakkan kandungan yang akan dicetak ke dalam span atau div, dan kemudian cetaknya melalui fungsi.

<span id='div1'>把要打印的内容放这里</span> 
<p>所有内容</p> 
<div id="div2">div2的内容</div> 
<a href="javascript:printme()" rel="external nofollow" target="_self">打印</a> 
<script language="javascript"> 
function printme() 
{ document.body.innerHTML=document.getElementByIdx_x_x('div1').innerHTML+'<br/>'+document.getElementByIdx_x_x('div2').innerHTML; 
window.print(); 
} 
</script>
Salin selepas log masuk

Jika anda ingin mencetak hanya sebahagian kecil daripada keseluruhan halaman, sebaiknya gunakan kaedah kedua.

Kaedah ketiga: Jika reka letak halaman yang akan dicetak sangat berbeza daripada halaman web asal, gunakan kaedah ini. Klik butang cetak untuk muncul tetingkap baharu, paparkan kandungan yang akan dicetak dalam tetingkap baharu, panggil kaedah window.print() dalam tetingkap baharu, dan kemudian tutup tetingkap baharu secara automatik.
window.print boleh mencetak halaman web, tetapi kadangkala kita hanya mahu mencetak kawalan atau kandungan tertentu Apakah yang perlu kita lakukan?

Mula-mula kita boleh meletakkan kandungan untuk dicetak dalam div, dan kemudian gunakan kod berikut untuk mencetak.

<html> 
<head> 
<script language="javascript"> 
function printdiv(printpage) 
{ 
var headstr = "<html><head><title></title></head><body>"; 
var footstr = "</body>"; 
var newstr = document.all.item(printpage).innerHTML; 
var oldstr = document.body.innerHTML; 
document.body.innerHTML = headstr+newstr+footstr; 
window.print(); 
document.body.innerHTML = oldstr; 
return false; 
} 
</script> 
<title>div print</title> 
</head> 

<body> 
//HTML Page 
//Other content you wouldn't like to print 
<input name="b_print" type="button" class="ipt" onClick="printdiv('div_print');" value=" Print "> 

<div id="div_print"> 

<h1 style="Color:Red">The Div content which you want to print</h1> 

</div> 
//Other content you wouldn't like to print 
//Other content you wouldn't like to print 
</body>
</html>
Salin selepas log masuk
Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan