web-gelistirme-sc.com

Bir web sayfasına yazdırma düğmesi nasıl eklenir

Web sitemdeki sayfalarımdan birinde (php ile kodlanmış), her biri web sayfasının bir kısmını basan 2 (daha fazla) baskı düğmesi eklemeye çalışıyorum. Örneğin, bir sayfada bazı değerleri ve altında 2 grafikleri olan bir tablo var. Birini tabloyu basarken diğerini iki grafiği basan 2 adet basma düğmesi eklemek istiyorum. Bunu buldum Örnek / ama açıkça anlayamadım. Herhangi bir yardım veya örnekler bana yardımcı olacaktır.

Şimdiden teşekkürler.

6
Anil

Basit bir fikir, bazı önceki css yazdırma kuralları ad hoc oluşturmaktır;.

.printtable * { display : none; }
.printtable table { display : block; }

ve

.printtableandgraph * { display : none; }
.printtableandgraph img { display : block; }

o zaman iki düğme, window.print() ifadesinden hemen önce gövde öğesi (veya tablonuzu ve grafikleri içeren diğer öğeler) için bir .printtable ve bir .printtableandgraph sınıfı eklemelidir.

(kullanıcı aynı baskı düğmesine iki kez veya daha fazla tıklarsa, öğenin zaten bu sınıf adını ayarlayıp ayarlamadığını kontrol edin)

6
fcalderan

Bu, tıklandığında tarayıcının Yazdır iletişim kutusunu başlatacak olan html/javascript kodudur.

<button onClick="window.print()">Print this page</button>
14
Ed Manet

Masanız bir div ile id = 'printTable' içinde ise:

<a href="#null" onclick="printContent('printTable')">Click to print table</a>

EDIT: İşte "printContent ()" işlevi

<script type="text/javascript">
<!--
function printContent(id){
str=document.getElementById(id).innerHTML
newwin=window.open('','printwin','left=100,top=100,width=400,height=400')
newwin.document.write('<HTML>\n<HEAD>\n')
newwin.document.write('<TITLE>Print Page</TITLE>\n')
newwin.document.write('<script>\n')
newwin.document.write('function chkstate(){\n')
newwin.document.write('if(document.readyState=="complete"){\n')
newwin.document.write('window.close()\n')
newwin.document.write('}\n')
newwin.document.write('else{\n')
newwin.document.write('setTimeout("chkstate()",2000)\n')
newwin.document.write('}\n')
newwin.document.write('}\n')
newwin.document.write('function print_win(){\n')
newwin.document.write('window.print();\n')
newwin.document.write('chkstate();\n')
newwin.document.write('}\n')
newwin.document.write('<\/script>\n')
newwin.document.write('</HEAD>\n')
newwin.document.write('<BODY onload="print_win()">\n')
newwin.document.write(str)
newwin.document.write('</BODY>\n')
newwin.document.write('</HTML>\n')
newwin.document.close()
}
//-->
</script>
7
wbcrimson

Yazdır Düğmesi

<button onClick="window.print()">Print this page</button>`

Kullanın Herhangi bir web sayfasını yazdırmak için bu kodu kullanın, tek bir baskı işlemi tüm buton ve menü çubuğunu geri çeker.

1
Piyush Tiwari

Sayfanın bir bölümünü yazdırmak için hızlı ve basit bir yaklaşım için bir print.css ve baskı düğmesini kullanabilirsiniz.

  1. Print.css dosyasını ayarlayın ve şunları ekleyin:
     body {visibility:hidden;}
     .print {visibility:visible;}
  1. Sayfanızın uygun bölümlerine .print sınıfını ekleyin.

  2. Düğme ekle:

<button onClick="window.print()">Print this page »</button>

Baskı sonuçları düzgün ve temiz.

0
Trusty Scout