jq打印插件jqprint

下载文件：https://webscripts.softpedia.com/script/Modules/jQuery-Plugins/jqPrint-68448.html

使用方法：

1、引入js

<script src="js/jquery.min.js"></script>
<script src="js/jquery.jqprint-0.3.js" type="text/javascript"></script>

2、html，打印按钮和打印区域

<button class="btn btn-primary" onclick="orderPrint()">打印</button>

<div id="orderprint"></div>

3、js


function orderPrint(){
	   var qstr="";      	  
       document.getElementById("orderprint").innerHTML="";
       
	   qstr= '<div><table style="width:800px;margin:0 auto;"> <tbody> <tr>'
	           
	            
		 	    +'<td style="text-align:center;color:red;">xxxxxxxxxxxx</td>'
		 	   
			    +'</tbody></table></div>';	
		        document.getElementById("orderprint").innerHTML=qstr;
		  
		        $("#orderprint").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
				})
	   
}

4、引入样式表，插件样式单独写入一个样式表，引用如下

<link href="test.css" rel="stylesheet" type="text/css" media="print"/>

5、input框中输入的值打印，调用jqprint()之前，先

var val = $("#input").val();
$("#input").attr("value",val);

猜你喜欢