网页调用打印机

网页上使用打印机，其实很简单

1.布局自己想要打印的页面，比如这样的

<html>
<head>
    <title>dskfhkdfkd</title>
</head>
<style>
html,body{
	width:100%;
	margin:0;
	padding:0;
}
div{
	width:100%;
	text-align:center;
}
table {
	width:100%;
	text-align:center;
	border:1 solid #000;
}
table tr td{
	text-align:center;
}
</style>
<body>
<div id="box">哈哈哈哈哈</div>
<div id="div1">世界那么大我想去看看
	<table border=1>
		<tr>
			<td>1</td>
			<td>2</td>
			<td>3</td>
			<td>4</td>
			<td>5</td>
		</tr>
		<tr>
			<td>1</td>
			<td>2</td>
			<td>3</td>
			<td>4</td>
			<td>5</td>
		</tr>
		<tr>
			<td>1</td>
			<td>2</td>
			<td>3</td>
			<td>4</td>
			<td>5</td>
		</tr>
		<tr>
			<td>1</td>
			<td>2</td>
			<td>3</td>
			<td>4</td>
			<td>5</td>
		</tr>
	</table>
</div>
<a id="test" href="javascript:void(0)" target="_self">打印</a>
<script>
$("#test").on("click",function(){
			//var bodyHTML=window.document.body.innerHTML;
  // 想要打印的局部页面，所以需要类似下边的赋值
			window.document.body.innerHTML=$("#div1").html();
			// 这个就是调用系统的打印设备
   window.print();
			//window.document.body.innerHTML=bodyHTML;
})
</script>
</body>
</html>

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
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70

2.网页效果如下

3.看看调出的打印页面吧

第二种方式：使用媒体查询，加些控制，比如背景水印。

<style>
@media print{
    /* 不让第一个div在打印的页面内显示 */
    #box{
        display:none;
    }
}
</style>

1
2
3
4
5
6
7
8

第三种方式：flash，版权维护，内容版权，不会暴露网页地址，审查元素也看不见的

# 网页调用打印机

网页调用打印机