javascript ,window.print()打印页面,隐藏不需要的部分,指定区域打印。
<div class="container">
<p>内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容</p>
<p>内容内容内容内容内容内容内容内容内容内容</p>
</div>
\<div id="bottom"\>
\<p\>bottom内容\</p\>
\</div\>
\<div id="footer"\>
\<p\>footer内容\</p\>
\</div\>
\<a href="javascript:;" onclick="doPrint();" \>打印清单\</a\>
\<script type="text/javascript"\>
function doPrint(){
console.log('\*\*\*\*\*\*\*打印');
//下面隐藏页面中不需要的部分
$('.container').css('margin-top','200px');
$('.container').css('margin-left','10px');
$('#bottom').hide();
$('#footer').hide();
//下面这个解决打印预览出现一页空白的问题
$('body').css('height','85%');//缩小点,要不会出现两页
var ss=window.print();
console.log('*****ss****' , ss );
//点击"打印"或"取消"后返回"undefined"
if(ss == undefined){
console.log('***undefined****');
//直接刷新下页面,恢复页面样式
window.location.href=window.location.href;
//也可以执行js,恢复页面样式
/*
$('.container').css('margin-top','0');
$('.container').css('margin-left','0');
$('#bottom').show();
$('#footer').show();
$('body').css('height','100%');
*/
}
}
`</script>`