Bir dosyanın baskı tetikleyen bir bağlantı oluşturmak nasıl?

5 Cevap php

Ben bazı küçük resimler var ve her bir "büyük görüntü yazdırmak" bağlantı vardır.

Örneğin:

<img src="thumb.jpg">
<a href="#">Print Larger Image</a>

Kullanıcı "büyük resim yazdırmak" bağlantısını tıkladığında, amacım "big.jpg" bir baskı tetikleyecek olan.

Bu nasıl yapılabilir?

EDIT: ANTHONY HAD THE RIGHT SOLUTION FOR ME. I MODIFIED HIS CODE A BIT TO GET IT WORKING. HERE'S THE FULL, WORKING CODE

<style>
@media screen {
.printimage {
     display: none;
}
}

@media print {
body * {
    display: none;
}
.printimage {
     display: block;
}
}

</style>

<a id="bigimage" href="#">Print Big Image</a>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>
 $(document).ready(function(){

     $("#bigimage").click(function() {
          $("body").append("<img src='http://sstatic.net/so/img/logo.png' class='printimage' >");
          window.print();
     });

});

</script>

5 Cevap

Bu gerçekten tuhaf ve harika olurdu, ama yapabileceği bir şey var:

print large image linki tetiği "printable_image" bir sınıf ile DOM'ye büyük resim ekler bir javascript işlevi var.

Sonra CSS kuralları bir @screen ve tarayıcıda görüntüyü gizlemek ancak Çıktı için görüntünün her şeyi ama gizlemek @print kuralları ile kurdunuz.

Then call the already mentioned window.print() function. The only catch is that users wouldn't see anything if they just wanted to print the screen, so you'd have to add the @print rule with the js to avoid this.

HTML:

<img src="thumb.jpg">
<a href="#" id="bigimage">Print Larger Image</a>

(Jquery) JS:

$function() {
     $("#bigimage").click(function() {
          $(body).amend("<img src='bigimage.png' class="printimage" />");
     });
});

CSS:

@media screen {
.printimage {
     display: none;
}
}

@media print {
body * {
    display: none;
}
.printimage {
     display: block;
}
}
<a href="javascript:window.Print(); return false;">Print Larger Image</a>

Bu geçerli sayfayı basacaktır, ancak JoostK cevabı eklemek için, resme yönlendirmek:

<a href="page.php?image=big.jpg">Print Larger Image</a>

) Sonra page.php içinde, görüntü yüklemek ve daha sonra vücut onload olayı, (window.print çağrı;

EDIT:

Kullanıcı aynı sayfada kalmak için izin vermek için, ben mümkün olduğuna inanıyorum, ama ne yapabileceğini değil mi:

<a href="page.php?image=big.jpg" target="_blank">Print Larger Image</a>

Sonra window.print(); Eğer window.close(); çağırabilirsiniz çağrıldıktan sonra (bu tarayıcı geçerli pencereyi kapatmak istediğini belirten bir iletişim kutusu açılır belki olduğunu tamam, ya bu satırlar boyunca bir şey)

window.print () javascript bunu yapacağız, ama bu sadece geçerli sayfayı yazdıracaktır. Eğer yeni bir sekme içine img başlatmak ve yazdırma komutu çalıştırmak için çalışıyorsanız, birkaç komutları birleştirmek gerekir.

<img src="thumb.jpg" alt="Alternative text" />
<a href="big.jpg">Print Larger Image</a>

Bu gerçekten temel HTML, hiçbir JS / PHP veya herhangi ihtiyaç var.

Geçerli sayfayı yazdırmak için böyle bir bağlantı oluşturabilirsiniz ...

<a href="JavaScript:window.print();">Print this page</a>

ya auto böyle bir şey yapabilirsiniz, kısa sürede yükler gibi bir sayfa yazdırmak ...

<body onload="window.print();">