JS分页打印使用window对象的print方法实现

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>分页打印 - JS分页打印使用window对象print的方法实现</title>
		<meta charset="UTF-8">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	</head>

	<body>
		<div><input type="button" value="分页打印" onclick="pagePrint()" /></div>
		<script language="javascript">
			//分页打印代码
			function pagePrint() {
				var imgs = [
					'https://g.csdnimg.cn/side-toolbar/2.5/images/qr_wechat.png',
					'https://g.csdnimg.cn/side-toolbar/2.5/images/qr_wechat.png',
					'https://g.csdnimg.cn/side-toolbar/2.5/images/qr_wechat.png'
				];
				var body = "<body>";
				for (var i = 0; i < imgs.length; i++) {
					//设置分页page-break-after:always
					body += '<table width="100%" border="0" cellpadding="0" cellspacing="0" style="page-break-after:always">';
					body += '<tr>';
					body += '<td><img src="' + imgs[i] + '" width="280"></td>';
					body += '</tr>';
					body += '</table>';
				}
				body += '</body>';
				//打印页面头文件
				var head = '<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>';
				//去掉打印页眉页脚的样式
				var style = '<style media="print">@page {size: auto;margin: 0mm;}</style>';
				var printWindow = window.open("Print.htm", "print"); //本地测试,需要新建Print.html,域中使用,不需要
				printWindow.document.write('<html>' + head + body + style + '</html>');
				printWindow.document.close(); //这句很重要,没有就无法实现  
				printWindow.print();
			}
		</script>
	</body>
</html>

猜你喜欢

转载自blog.csdn.net/luolinyin/article/details/108025041