Belajar Javascript Lengkap
Page Printing JavaScript
Belajar javascript dasar lengkap untuk pemula – Web Print atau pengambilan dokumen / gambar melalui media website ialah salah satu komponen penting yang seringkali di sertakan dalam beberapa website khusus, seperti perbankan dan akademik. Kehadiran web print tersendiri dapat mempermudah pengguna dalam mengambil informasi maupun data website tanpa harus mengandalkan media screenshot (yang umumnya telah disediakan oleh sistem) yang membatasi halaman layar pengambilan.
Page Printing dengan JavaScript
Sering kali Anda ingin menempatkan tombol di halaman web Anda untuk mencetak konten halaman web tersebut melalui printer yang sebenarnya. JavaScript membantu Anda untuk mengimplementasikan fungsi ini menggunakan fungsi cetak objek jendela. Fungsi cetak JavaScript window.print() mencetak halaman web saat ini saat dijalankan. Anda dapat memanggil fungsi ini secara langsung menggunakan event onclick seperti yang ditunjukkan pada contoh berikut :
<!DOCTYPE html> <html> <body> <h2>The window.print() Method</h2> <p>Click the button to print the current page.</p> <button onclick="window.print()">Print this page</button> </body> </html>
Meskipun bisa dengan cara diatas, akan tetapi tidak disarankan. Halaman yang bisa di cetak tersebut hanya halaman dengan teks, tidak bisa cetak gambar, grafik atau iklan yang ada.
Bagaimana cara mencetak Sebagian halaman atau hanya sebagian halaman yang dikehendaki saja, berikut contoh kodenya :
<!DOCTYPE html>
<html>
<head>
<title>Mencetak Sebagian Dokumen dengan JavaScript</title>
<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>Tutorialweb</h1>
<div id="div1">Tutorial Pemrograman JavaScript</div>
<button onclick="printContent('div1')">Print</button>
<div id="div2">Tutorial JavaScript</div>
<button onclick="printContent('div2')">Print</button>
<p id="p1">Developh Website</p>
<button onclick="printContent('p1')">Print</button>
</body>
</html>
Belajar javascript dasar lengkap
<< Part 8
Referensi :
- Abdul Qadir, 2013, From Zero to A Pro Javascript & Jquery, Andi Yogyakarta
- Tutorials point, 2015, JavaScript Language Tutorials Point, E-book,com
- w3schools.com
