JS实现浏览器打印(自动隐藏页眉和页脚)

本文只介绍如何自动隐藏页眉和页脚

在浏览器打印中,浏览器会自动勾选打印页眉和页脚,只要几行代码即可去除,

打印二维码为demo

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>打印</title>
		<!--		去除页眉页脚		-->
		<style media="print">
			@page {
				size: auto;  /* auto is the initial value */
				margin: 0mm; /* this affects the margin in the printer settings */
			}
		</style>
	</head>
	<body>

		<div id="qrcode"></div>
		<input type="button" id="print-btn" value="打印" οnclick="toPrint()"/>

		<script src="${rc.contextPath}/statics/libs/jquery.min.js"></script>
		<script src="${rc.contextPath}/js/sys/qrcode.min.js"></script>
		<script>
			function toPrint(){
				$("#print-btn").css("display","none")
				window.print();
			}
			$(function(){
				let nummber = getQueryString("nummber");
				//获取连接带参
				function getQueryString(name) {
					var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
					var r = window.location.search.substr(1).match(reg);
					if (r != null) {
						return unescape(r[2]);
					}
					return null;
				}

				// 设置 QRCode 参数
				var qrcode = new QRCode('qrcode', {
					text: "http://www.abc.com/order.do?order="+nummber,
					width: 80,
					height: 80,
					colorDark: '#000000',
					colorLight: '#ffffff',
					correctLevel: QRCode.CorrectLevel.H
				});
			});

		</script>
	</body>
</html>

 

 

 完成...

原文链接:加载失败,请重新获取