HTML sayfada javascript ile div print
Merhaba arkadaşlar,
Bugün ki konumuz html bir sayfa içerisinde sadece belli bir div'in javascript kodları ile print alınmasını sağlamak. Kendim böyle bir sorun yaşadığım için bulduğum bilgileri sizler için derledim. Ekteki dosyadan html olarak örneği inidrebilirsiniz. Öncelikle html sayfamıza bir adet div ekliyoruz ve div'imizin id'sini belirliyoruz. Biz şimdilik "printableDiv" diyelim.
Şimdi javascript kodlarımızı yazalım; burda önemli nokta şudur. Browser'ınızın popup engelleyicisinin kapalı olması gerekmektedir. Çünkü aşağıda yaptığımız işlem doğrultusunda yukarıda yazmış olduğumuz div'in popup olarak farklı bir pencerede açıp o pencerenin yazma işlemini gerçekleştirme yoluna gideceğiz.
Şimdi sıra butonumuzu hazırlamada bir adet image objesi koyuyoruz ve "onclick" eventini dolduruyoruz. Bu benim butonum artık siz nasıl bişey yaparsınız bilemem :D
Örnek programı buradan indirebilirsiniz.
Umarım yardımcı olabilmişimdir.
Kolay Gelsin
Aslı YILMAZ DEMİRBAŞ
Bugün ki konumuz html bir sayfa içerisinde sadece belli bir div'in javascript kodları ile print alınmasını sağlamak. Kendim böyle bir sorun yaşadığım için bulduğum bilgileri sizler için derledim. Ekteki dosyadan html olarak örneği inidrebilirsiniz. Öncelikle html sayfamıza bir adet div ekliyoruz ve div'imizin id'sini belirliyoruz. Biz şimdilik "printableDiv" diyelim.
<div id="printableDiv">
Merhaba Dünya...
</div>
Şimdi javascript kodlarımızı yazalım; burda önemli nokta şudur. Browser'ınızın popup engelleyicisinin kapalı olması gerekmektedir. Çünkü aşağıda yaptığımız işlem doğrultusunda yukarıda yazmış olduğumuz div'in popup olarak farklı bir pencerede açıp o pencerenin yazma işlemini gerçekleştirme yoluna gideceğiz.
<script language="javascript"
type="text/javascript">
function
PrintEtBakalim(strid) {
var prtContent =
document.getElementById(strid);
var WinPrint = window.open('', '', 'letf=0,top=0,toolbar=0,status=0,scrollbars=1');
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
}
</script>
Şimdi sıra butonumuzu hazırlamada bir adet image objesi koyuyoruz ve "onclick" eventini dolduruyoruz. Bu benim butonum artık siz nasıl bişey yaparsınız bilemem :D
<img alt="" src="images/printcurrentpage.png" onclick="PrintEtBakalim('printableDiv')"
value="sdf"
style="cursor: pointer"/>
Örnek programı buradan indirebilirsiniz.
Umarım yardımcı olabilmişimdir.
Kolay Gelsin
Aslı YILMAZ DEMİRBAŞ
Yorumlar
Yorum Gönder