Cara Print Halaman Web dengan Javascript

Publish Date : 13-04-2016 , dibaca 27634 kali, Hari ini dibaca : 1 kali ,0 comments

Admin akan share artikel Cara Mencetak Halaman Web Sebagian dan Seluruh dengan javascript, Setelah dulu admin posting artikel Print atau Save halaman Website ke PDF denga Java Script, kali ini admin akan share tehnik mencetak halaman web dengan code yang berbeda.. , Terkadang dalam membuat aplikasi dibutuhkan output berupa laporan yang harus di cetak, penting disini dalam mengetahui tehnik print halaman web dengan javascript

Code Yang digunakan untuk mencetak / print halaman ini sangat simple dan mudah dimengerti,, so.. Silahkan dicoba ya.. / di bookmark postingan ini

Untuk Demo Silahkan Lihat disini

Cara Pertama Untuk Mencetak Halaman Web dengan Javascript

Pada cara ini kita cukup menggunakan onClick="window.print(); untuk mencetak halaman Web, Cara ini digunakan untuk mencetak seluruh halaman website

Contoh Code :

<html>
<head>
<title>Print</title>
</head>
<body>
<h1>Contoh Print Materi IT</h1>

<a href="index.php">
<button onClick="window.print();">Print</button>
</a>

</body>
</html>

Script / Code untuk mencetak halaman Web seluruh dan Sebagian

Cara ini, dapat digunakan untuk mencetak sebagian atau seluruh halaman website, Silahkan copy paste code dibawah ini di text editor anda, dan jalankan dengan browser :

<!DOCTYPE html>
<html>
<head>
<script>
function printContent(el){
    var restorepage = document.body.innerHTML;
    var printcontent = document.getElementById(el).innerHTML;
    document.body.innerHTML = printcontent;
    window.print();
    document.body.innerHTML = restorepage;
}
</script>
</head> 
<body> 
<h1>My page</h1>
<div id="div1">DIV 1 content...</div>
<button onclick="printContent('div1')">Print Content</button>
<div id="div2">DIV 2 content...</div>
<button onclick="printContent('div2')">Print Content</button>
<p id="p1">Paragraph 1 content...</p>
<button onclick="printContent('p1')">Print Content</button>
</body> 
</html>