JQuery打印插件:jqprint ,插件下载、在线演示和详细使用方法

WEB开发中有的时候需要直接调用打印功能,目前虽然可以通过内置的函数实现打印,可兼容性却不是很好。这里我向大家推荐一个JQuery插件:jqprint 。

使用内置函数实现简单打印功能:http://www.ityouzi.com/archives/jquery-method-2.html

jqprint 具有以下优势:

  1. 兼容性好,支持IE6及以上版本、谷歌浏览器、火狐浏览器、Safari,浏览器兼容性是前端开发的一大痛,每次提及这个问题都想说坑爹的IE。
  2. 使用简单,只需要下载相关JS文件,然后在项目添加即可。
  3. 技术成熟,通过官方的不断的更新bug还是比较少的。

插件下载和演示

下载地址       在线演示

 

使用方法

1、引用JQuery和jqprint到页面中(下载包有)

<script language="javascript" src="jquery-1.4.4.min.js"></script> 
<script language="javascript" src="jquery.jqprint-0.3.js"></script>

 

2、编写HTML代码

<div id="Content"> 
	<table>
		<tr> 
			<td>test</td> 
			<td>test</td> 
			<td>test</td> 
			<td>test</td> 
			<td>test</td> 
		</tr> 
	</table>
</div> 
<input type="button" onclick=" Print()" value="打印"/>

 

3、添加JS

<script language="javascript"> 
   function Print(){ $("#Content").jqprint(); } 
</script>

 

4、其他相关参数

$("#Content").jqprint({ 
	debug: false, //如果是true则可以显示iframe查看效果(iframe默认高和宽都很小,可以再源码中调大),默认是false 
	importCSS: true, //true表示引进原来的页面的css,默认是true。(如果是true,先会找$("link[media=print]"),若没有会去找$("link")中的css文件) 
	printContainer: true, //表示如果原来选择的对象必须被纳入打印(注意:设置为false可能会打破你的CSS规则)。 
	operaSupport: true//表示如果插件也必须支持歌opera浏览器,在这种情况下,它提供了建立一个临时的打印选项卡。默认是true 
});

注意事项

如果出现: Cannot read property ‘opera’ of undefined 。 这个是juqery版本兼容问题

解决方法:加入迁移辅助插件jquery-migrate-1.0.0.js可解决版本问题

<script src="http://code.jquery.com/jquery-migrate-1.1.0.js"></script>

 

发布者:IT柚子,转转请注明出处:https://ityouzi.com/archives/jquery-jqprint.html

(34)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
IT柚子的头像IT柚子
上一篇 2019年4月2日 下午2:00
下一篇 2019年4月2日 下午2:10

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注