contact

Contact Person
Pin BB : 5AB31960
SMS : 082288467823
WA : 081275371724
call : 081275668074


Cara Print Halaman Web dengan Javascript

Posted in Javascript Jquery Life at 13 April 2016 With 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

▼ Download Source Code Dibawah Ini ▼



Untuk Demo Silahkan Lihat disini

cara print halaman website dengan javascript

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>

Klik link disini untuk melihat Demonya

Artikel Terkait

Diskusi