net mvc jQuery print 打印隐藏dom 除去页眉页脚_mvc 使用 print.js

Html

<script src="~/Scripts/jquery.print.js"></script>

用于隐藏打印的页眉页脚，因为mvc中cshtml视图里 @符是关键字，所以引用样式文件。 需注意media="print"。
<link media="print" href="~/Scripts/css/print.css" rel="stylesheet" />

页面的样式
<style type="text/css">
.pad10 {
        padding: 10px;
    }
.hide {
    display: none;
}
打印容器默认隐藏
#psdiv {
    display: none
}
</style>

打印的时候显示。注意：这个顺序必须在页面样式的后面
<style media="print">
    #psdiv {
        display: block
    }
</style>


打印的dom容器
<div id="psdiv" class="hide">

</div>

<script type="text/javascript">
点击打印
function aaa(){
	 $("#psdiv").print({
	     globalStyles: true,
	     mediaPrint: false,
	     deferred: $.Deferred().done(function () {
	         //console.log('Printing done', arguments);
	         //alert(000);
	     })
	 });
}

</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46

print.css

@page {
    size: auto; /* auto is the initial value */
    margin: 0mm 10mm 0mm 10mm; /* this affects the margin in the printer settings 最关键的还是这个*/
    /*size: portrait;// 或landscape 设置横纵向打印*/
    
}
1
2
3
4
5
6

jQuery print 库文件，免费下载
https://download.csdn.net/download/ganggelove/71854119

相关资源：
本文其他代码