js的window.print()打印背景图片,打印背景图片无法显示

js的window.print()打印背景图片

题目描述
js的window,print()打印背景图片给body加了图片地址之后,非要设置浏览器打印选项里面设置背景图形打印才行,怎么通过js去设置默认的就是打印带背景图像的

方法一 :css

//打印机媒体查询
@media print {
     body{
        -webkit-print-color-adjust:exact;
        -moz-print-color-adjust:exact;
        -ms-print-color-adjust:exact;
        print-color-adjust:exact;
    } 
    button{display:none;}
}

方法二 :js

function printPage(){
    var office = document.getElementsByClassName('office')[0];
    var imgs = office.getElementsByTagName('img');
    var img,src;
    if(!imgs.length){
        src = window.getComputedStyle(office,null).getPropertyValue('background-image').replace(/(^url)|\(|\)|\"/g,'');
        img = document.createElement('img');
        img.src=src;
        img.height = 150;
        img.width = 150;
        office.style.backgroundImage = 'none';
        office.appendChild(img);
    }
    window.print();
    //取消打印还原
    setTimeout(function(){
        office.removeChild(img);
        office.style.backgroundImage = 'url("'+ src +'")';
    },100)
}

引用地址

猜你喜欢

转载自blog.csdn.net/u013112461/article/details/102852409