批量打印之jquery局部打印

原创

于 2017-10-12 10:49:20 发布 · 2.4k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#jquery局部打印

本文介绍了使用jQuery的PrintArea插件实现局部打印的功能，包括导入库、源码解析、解决打印样式丢失问题及插件优缺点分析。在解决样式问题时，将<style>标签中的样式移至外部CSS文件并引入。该方法具有局部打印和良好浏览器兼容性的优点，但存在每次打印需手动选择打印机、自带页眉页脚以及无内置预览功能的缺点。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

上个月弄了个批量打印的功能，觉得以后可能用得着，就写个博客记一下，免得忘记了。说这个之前，先来说一下我用过的两个打印插件，一个是Jquery打印插件（这次开始用的），一个是smsx.cab控件的打印插件。这里先说jQuery的局部打印功能（个人觉得jqprint和PrintArea就打印功能这块大同小异，所以就说简单点的PrintArea）

1、导Jquery库：想用Jquery的功能就得有人家的内库嘛，这个是毋庸置疑的。

2、导入jquery.PrintArea.js：在导入jquery库之后导入。其源码如下：

(function($) {
	var printAreaCount = 0;
	$.fn.printArea = function() {
		var ele = $(this);
		var idPrefix = "printArea_";
		removePrintArea(idPrefix + printAreaCount);
		printAreaCount++;
		var iframeId = idPrefix + printAreaCount;
		var iframeStyle = 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;';
		iframe = document.createElement('IFRAME');
		$(iframe).attr({
			style : iframeStyle,
			id : iframeId
		});
		document.body.appendChild(iframe);
		var doc = iframe.conten