js打印方式，window.print()

页面打印的相关问题。

1.使用js自带的打印方式，window.print()方式进行打印。

去除页眉页脚，设置横向纵向或者A3等，在style上增加@page样式。

<style>
    @page {
        size:auto;
        margin: 0mm;
    }
</style>

size:landscape(横向)或者size:A3(A3) .

 

2.打印指定区域的div内容，使用printarea插件

引入js:

<script language="javascript" src="jquery-1.7.1.min.js"></script> 
<script type="text/javascript" src="jquery.PrintArea.js"></script>

html引用：

<div class="my_show"> 
这个是打印时显示的。 
</div> 
<div class="my_hidden"> 
这个是打印时隐藏的。 
</div> 
<input type="button" id="print"/>

js调用：

$(document).ready(function(){ 
    $("#print").click(function(){ 
        $(".my_show").printArea(); 
    }); 
});

此方式，在页面宽度足够宽时，打印依然会超出页面。

 

3.打印iframe的内容

<input type="button" value="打印此页面" onclick="printpage()" />
<div style="height:800px;width:800px;">
    <iframe style="height:100%;width:100%;" src="https://www.runoob.com" id="test"/>
</div>

js方法：

function printpage(){
	var iframe = document.getElementById('test');
    iframe.contentWindow.focus();//获取焦点
    iframe.contentWindow.print();
}

这种情况，在跨域的情况下，并不能实现跨域打印，跨域情况将打印功能加载子页面

可以通过url方式，增加isPrint=1参数，当进入子页面时进行判断，判断该参数，值是否为1直接进行打印操作。同样增加子页面增加打印按钮也能实现打印功能。

if(window.location.href.indexOf('isPdfPrint=1')>0){
    setTimeout(function(){
        window.print();
    },200)
}