2012-08-10 50 views
-3

我在我的网站上显示缩小尺寸的图像。我希望能够点击该图像,并打开全尺寸图像并打印出来。我在网上看过几个例子,但都是指打印出正在显示的图像。我需要将全尺寸的图像打开并打印以便清晰。在此先感谢在网站上打印图像

+0

我已经尝试使用javascript:image.print,但它只会打印正在显示的图像,这是缩略图版本 – syllable3 2012-08-10 01:58:13

+0

最简单的方法是做target = _blank和window.print()?不知道是否会有另一个可以将它们结合在一起的选项 – syllable3 2012-08-10 02:04:14

回答

1

可以隐藏另一分区内较大的图像和打印图像,而不是像

<script type="text/javascript"> 

function printDiv(divName) { 
    var printContents = document.getElementById(divName).innerHTML; 
    var originalContents = document.body.innerHTML; 

    document.body.innerHTML = printContents; 

    window.print(); 

    document.body.innerHTML = originalContents; 
} 

</script> 

<img src="images/smaller-img.jpg" /> 

<a href="#" onClick="printDiv('largeimg')">Print</a> 

<div id="largeimg" style="display:none;"> 
<img src="images/larger-img.jpg"> 
</div> 
0

HTML代码

<iframe id="ifrmPrint" src="#" style="width:0pt; height:0pt; border: none;"></iframe> 
<td colspan="2" align="center"><input onclick="print_imgs();" class="button" type="button" title="Print all the images which are displayed in slide show" value="Print All"></td> 

JAVA SCRIPT

function img_find() { 
      var imgs = document.getElementsByTagName("img"); 
      var imgSrcs = []; 

      for (var i = 0; i < imgs.length; i++) { 
       imgSrcs.push(imgs[i].src); 
      } 

      return imgSrcs; 
     } 

     function print_imgs(){ 
      var imgSrcs = img_find(); 
      try{ 
       var print_frame = document.getElementById('ifrmPrint'); 
       var print_doc = (print_frame.contentWindow || print_frame.contentDocument); 
       if (print_doc.document) print_doc = print_doc.document; 
       // Write printable content 
       print_doc.write("<html><head>"); 
       print_doc.write("<title>printing all images</title>"); 
       print_doc.write('</head><body onload="this.focus(); this.print();">'); 
       for(var i=0; i< imgSrcs.length; i++){ 
        print_doc.write("<img src='" + imgSrcs[i] + "' /><br>"); 
       } 
       print_doc.write("</body></html>"); 
       print_doc.close(); 
     } 
     catch(e){ 
       alert("printint in error state"); 
       self.print(); 
     } 
     } 
+4

您能否解释_how_这回答了这个问题? – Ben 2014-09-22 13:07:23