• 952 阅读
  • 1 回复

js打印window.print()图片打印-图片没加载完

视频在线上传+队列转换FLV+水印+捉图+修复+获时+转3GP(API语言不限,开视频站必备!)

1. 这里用的是A4纸,设置打印表格属性(width:100%,height:980px)
2.由于打印可能存在多页,所以heightt属性必须严格控制。
3.由于自己是先隐藏不需要打印的DIV,然后显示需要打印的DIV。当需要打印的DIV存在图片等资源导致加载较慢时。window.print又是异步的,所以存在图片没加载完就打印的情况。
解决方案:判断图片是否加载完成,加载完成在调用打印。(直接.onload不行,当浏览器有 缓存时不会进入方法)
var t_img; // 定时器
var isLoad = true; // 控制变量(判断图片是否 加载完成)
isImgLoad(function(){//判断全部打印图片加载完成
           window.print();
           // 加载完成
       });

//判断图片加载的函数
function isImgLoad(callback){
   // 查找所有打印图,迭代处理
   $('.printImg').each(function(){
       // 找到为0就将isLoad设为false,并退出each
       if(this.height === 0){
           isLoad = false;
           return false;
       }
   });
   // 为true,没有发现为0的。加载完毕
   if(isLoad){
       clearTimeout(t_img); // 清除定时器
       // 回调函数
       callback();
   // 为false,因为找到了没有加载完成的图,将调用定时器递归
   }else{
       isLoad = true;
       t_img = setTimeout(function(){
           isImgLoad(callback); // 递归扫描
       },500); // 我这里设置的是500毫秒就扫描一次,可以自己调整
   }
}
小鱼的淘宝店铺-多多支持哇
小鱼的淘宝店铺-多多支持哇