在使用window.print()进行打印时，打印的内容可能会包含图片内容，此时的图片内容不能设置为背景图片，否则将无法再打印页面显示。

<!doctype html>

<html>

    <head>

        <title></title>

        <script type="text/javascript">

            function printfun(){

                window.print();

            }

        </script>

    </head>

    <body>

        <input type="button" value="打印" onclick="printfun()"><br/>

        下面设置的img图片:

        <div>

            <img src="data:images/moganna.png">

        </div>

        下面图片是背景图片:

        <div style="background: url('images/moganna.png'); width: 500px; height: 291px;">

        </div>

    </body>

</html>

 

JS 打印图片的更多相关文章

  1. 页面性能优化-原生JS实现图片懒加载

    在项目开发中,我们往往会遇到一个页面需要加载很多图片的情况.我们可以一次性加载全部的图片,但是考虑到用户有可能只浏览部分图片.所以我们需要对图片加载进行优化,只加载浏览器窗口内的图片,当用户滚动时,再 ...

  2. LODOP用ADD_PRINT_IMAGE语句缩放打印图片

    LODOP提高输出图片质量的方法:1.用ADD_PRINT_IMAGE语句打印图片,而且img元素的width和height属性要去掉或者设置足够大,这样就可以让下载引擎传给Lodop图片质量足够好; ...

  3. jquery.wordexport.js打印echarts.js画出的柱状图

    jquery.wordexport.js打印echarts.js画出的柱状图. echarts画出的图是不能直接打印出来的(echarts的柱状图是用canvas画出来的),而jquery.worde ...

  4. 自定义Chrome的console（样式、打印图片、开关）

    1.常用console类型 console.log() 常规打印 console.warn() 打印警告信息 console.error() 打印错误信息 console.time() 和 conso ...

  5. css技术之用最高和最宽的限制“max-height和max-width”做图片同比例缩放，达到图片不变形目的，做出批量打印图片功能,页面打印“window.print()”

    一.简介 他们是为流而生的,像width/height这种定死的砖头式布局,min-width/max-width就没有存在的意义 ,min-width/max-width一定是自适应布局或流体布局中 ...

  6. js简单 图片版时钟，带翻转效果

    js简单 图片版时钟,带翻转效果 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  7. JS实现图片预加载无需等待

    网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...

  8. js 打印

    关于js打印很简单的一段代码 function doPrint() { var newWindow = window.open("打印窗口", "_blank" ...

  9. js压缩图片base64长度

    var myCanvas=$('.img-container > img').cropper('getCroppedCanvas'); (function (base64){ var image ...

随机推荐

  1. Spring+MyBatis实现数据库读写分离方案

    推荐第四种:https://github.com/shawntime/shawn-rwdb 方案1 通过MyBatis配置文件创建读写分离两个DataSource,每个SqlSessionFactor ...

  2. 文件上传(asp.net webform中)

    1.配置允许上传文件大小 <configuration> <appSettings> <!--配置上传文件最大字节数:单位KB--> <add key=&qu ...

  3. IFE2017笔记

    1. jQuery.trim()方法 jQuery 杂项方法 实例 删除字符串开始和末尾的空格 2.jQuery的map方法可以批量操作数组中元素,可以替代传统在循环中处理完数据挨个push进数据的代 ...

  4. CRM 2016 升级CRM365之注意事项

    https://docs.microsoft.com/zh-cn/previous-versions/dynamicscrm-2016/deployment-administrators-guide/ ...

  5. adversarial example研究

    Paper: Practical Black-Box Attacks against Machine Learning 一.介绍 概况:Ian Goodfellow大神研究如何在不知道model内部结 ...

  6. virtual box + win7 + usb + share folder

    1.enable virtaulization on BIOS 2.new machine setup, memory, harddisk size 3. 4.install extension pa ...

  7. Android CoordinatorLayout实现多列表切换并和头布局联动；

    注意:不是双列表联动,是多列表和头布局联动: 大概就是和饿了么店铺首页类似的布局框架吧,头布局显示时,列表RecyclerView或ScrollView和头布局一起滚动,头布局完全隐藏后列表再去滚动, ...

  8. springmvc接收前台（如ajax）传来的数组list,set等图文详解

        ref:https://blog.csdn.net/wabiaozia/article/details/50803581 前言: 相信很人都被springmvc接收数组问题折磨过,查过几个解决 ...

  9. Weblogic重起后打开控制台登陆后响应极慢

    linux下Weblogic 重启后第一次打开console登陆后响应极慢(20多分钟)(锁定并编辑第一次也极慢),以后速度就正常了,重启后又会极慢! 在网上看了看,是说linux下的java生成随机 ...

  10. 3. group_concat与oracle中wm_concat用法一样

    例子如下: select group_concat(rp.ROLE_ID) from eic_right_role_operator rp where rp.OPERATOR_ID = #id#