猿问

打印 img 源不是 img 本身不起作用,当来自本地主机的 img 时

当用户单击图像时,我正在尝试打印图像。


当来自互联网的 img 时它可以工作,但当它来自我自己的电脑(本地主机)时它不起作用。但是为什么?


我尝试了很多脚本,但都给了我相同的结果。


提前致谢


<!DOCTYPE html>

<html>

<head>

</head>

<body>

        <div id="tab"><img style="width:600px; hieght:600px;" src="https://scontent.fgza6-1.fna.fbcdn.net/v/t1.15752-9/90511757_144802246885621_238915900961456128_n.jpg?_nc_cat=111&_nc_sid=b96e70&_nc_ohc=r3aJA4RgmrIAX9uj7MO&_nc_ht=scontent.fgza6-1.fna&oh=bc1a6cdf63922303eb725277d019cffa&oe=5EA69107" alt="Bald Eagle" />

        </div> 



    <div id="tab2"><img style="width:600px; hieght:600px;" src="http://localhost:8000/storage/images/VW5wb8YGHetqZy8BKcnQuCVGcJwqXgakKViyeuoV.jpeg" alt="Bald Eagle" />

        </div>


    <p>

        <input type="button" value="Print img" onclick="myApp.print()" /> <!-- it's work -->

        <input type="button" value="Print img local" onclick="myApp2.printLocal()" /> <!-- it not work !! -->

    </p>

</body>

<script>

    var myApp = new function () {

        this.print = function () {

            var tab = document.getElementById('tab');

            var win = window.open('', '', 'height=508,width=580');

            win.document.write(tab.outerHTML);

            win.document.close();

            win.print();

        }

    }


    var myApp2 = new function () {

        this.printLocal = function () {

            var tab = document.getElementById('tab2');

            var win = window.open('', '', 'height=508,width=580');

            win.document.write(tab.outerHTML);

            win.document.close();

            win.print();

        }

    }

</script>

</html>


POPMUISE
浏览 88回答 1
1回答

元芳怎么了

我已经在本地主机上尝试了您的代码,它运行良好,我确实给了而不是src="/storage/images/VW5wb8YGHetqZy8BKcnQuCVGcJwqXgakKViyeuoV.jpeg"src="http://localhost:8000/storage/images/VW5wb8YGHetqZy8BKcnQuCVGcJwqXgakKViyeuoV.jpeg"试试运气从文件上载打印.HTML<input type="file" accept="img/*" onchange="fileChanged(event)" />&nbsp;.JSfunction fileChanged(e){&nbsp; let file=e.target.files[0];&nbsp; document.querySelector('#tab2>img').src=window.URL.createObjectURL(file);&nbsp;}<!DOCTYPE html><html><head></head><body>&nbsp; &nbsp; &nbsp; &nbsp; <div id="tab"><img style="width:100px; height:100px;" src="https://scontent.fgza6-1.fna.fbcdn.net/v/t1.15752-9/90511757_144802246885621_238915900961456128_n.jpg?_nc_cat=111&_nc_sid=b96e70&_nc_ohc=r3aJA4RgmrIAX9uj7MO&_nc_ht=scontent.fgza6-1.fna&oh=bc1a6cdf63922303eb725277d019cffa&oe=5EA69107" alt="Bald Eagle" />&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp;&nbsp; &nbsp; <div id="tab2"><img style="width:100px; height:100px;" src="" />&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; <p>&nbsp; &nbsp; &nbsp; &nbsp; <input type="button" value="Print img" onclick="myApp.print()" /> <!-- it's work -->&nbsp; &nbsp; &nbsp; &nbsp; <input type="file" accept="img/*" onchange="fileChanged(event)" />&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; <input type="button" value="Print img local" onclick="myApp2.printLocal()" /> <!-- it not work !! -->&nbsp; &nbsp; </p></body><script>&nbsp; &nbsp; var myApp = new function () {&nbsp; &nbsp; &nbsp; &nbsp; this.print = function () {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var tab = document.querySelector('#tab>img');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var win = window.open('', '', 'height=508,width=580');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; win.document.write(tab.outerHTML);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; win.document.close();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; win.print();&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }&nbsp; &nbsp; function fileChanged(e){&nbsp; &nbsp; &nbsp; let file=e.target.files[0];&nbsp; document.querySelector('#tab2>img').src=window.URL.createObjectURL(file);&nbsp;&nbsp; &nbsp; }&nbsp; &nbsp; var myApp2 = new function () {&nbsp; &nbsp; &nbsp; &nbsp; this.printLocal = function () {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var tab = document.querySelector('#tab2>img');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var win = window.open('', '', 'height=508,width=580');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; win.document.write(tab.outerHTML);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; win.document.close();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; win.print();&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }</script></html>
随时随地看视频慕课网APP

相关分类

Html5
我要回答