window.print打印指定div指定网页指定区域的方法

第一种方法:指定不打印区域

html

<button onclick="print_()">打印</button>
<div>
     <p  id="print_">个人信用报告</p>
     <div class="no-print">报告编号:2017071400004196333458</div>
</div>

javascript

function print_(){
     window.print()
}

css

@media print{
        .no-print{visibility:hidden ;}
}

第二种方法:指定打印区域
html 同上
js

function print_(){
        document.body.innerHTML=document.getElementById("print_").innerHTML;
        window.print()
}

如果要打印的页面排版和原web页面相差很大,采用此种方法。点打印按钮弹出新窗口,把需要打印的内容显示到新窗口中,在新窗口中调用window.print()方法,然后自动关闭新窗口。

html

<input name="b_print" type="button" onClick="printdiv('div_print');" value=" Print "> 
<p  id="print_">个人信用报告</p>
<div id="div_print"> 
    <h1 style="Color:Red">The Div content which you want to print</h1> 
</div>

js

function printdiv(printpage){ 
        var headstr = "<html><head><title></title></head><body>"; 
        var footstr = "</body>"; 
        var newstr = document.all.item(printpage).innerHTML; 
        var oldstr = document.body.innerHTML; 
        document.body.innerHTML = headstr+newstr+footstr; 
        window.print(); 
        document.body.innerHTML = oldstr; 
        return false; 
        } 

猜你喜欢

转载自blog.csdn.net/cherish_all/article/details/77717479