Jquery网页打印

今天做项目中,需要用到打印功能,开始的时候用js来调用打印机,之后样式,还有什么的都没有了,之后ie有时候还运行不了,后来就在网上找,之后发现jquery有打印插件,所以就用了,并且发现jquery打印还可以打印局部,真的太棒了,一般的调用方式为:

实现步骤

1)引用2个js文件

2)定义打印区域的div,打印按钮

3)为打印按钮绑定打印事件

代码如下:

<%@pagelanguage="java"contentType="text/html;charset=utf-8"pageEncoding="utf-8"%>

<%@pageimport="java.util.*"%>

<html>

<head>

<title></title>

</head>

<scripttype="text/javascript"src="jquery-1.9.1.js"></script>

<scripttype="text/javascript"src="jquery.PrintArea.js"></script>

<body>

<inputid="btnPrint"type="button"value="打印"/>

<divid="myPrintArea">

====打印区域====

</div>

</body>

<scripttype="text/javascript">

$(function(){

//打印

$("#btnPrint").bind("click",function(event){

$("#myPrintArea").printArea();

});

});

</script>

</html>

如果不一般的调用,到这里基本上没有什么问题了,但是我的那个是用table,之后而且进行了表格的合并,这个时候出现了一个奇怪的问题,就是打印的开始行没有线条,后面的都是非常的正常,开始我很郁闷,之后用一个普通的表格进行试(没有任何样式什么的设置),非常的正常,这个时候我就慢慢的查找,最后发现原来table中的td设置的rowspan属性,这个时候就有问题了,还有一个就是当<tr>标签体为空的时候,线条会加粗,之后时候我把rowspan和空的tr去掉就好了,一切都正常了,所以希望大家注意这些问题。

还有一个问题就是在打印的时候,会出现url和页眉,这个非常容易去掉,在浏览器点击“页面设置”,把url和页眉那些你不需要的去掉就可以了。

相关推荐