Question

我的网站上显示的图片尺寸缩小了。我希望能够单击该图像，然后打开全尺寸图像并将其打印出来。我在网上看到了一些例子，但它们都是指打印出正在显示的图像。我需要打开并打印全尺寸图像才能清晰易读。提前致谢

Answer 1

您可以将较大的图像隐藏在另一个div中，然后打印该图像，例如

<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>

Answer 2

HTML CODE

<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();
        }
        }

在网站上打印图像

2 个答案: