`
信仰在天空飘荡
  • 浏览: 12380 次
社区版块
存档分类
最新评论

WEB页面打印预览、打印 兼容所有浏览器

页面打印打印预览web页面打印兼容所有浏览器ie打印预览 
阅读更多

因项目里要做页面打印预览以及打印功能，还要求兼容大部分主流浏览器

实现方式有很多最后决定用window.print();大部分浏览器都适用，

window.print()方式ie浏览器不支持打印预览，针对ie浏览器的预览用ie自有打印组件

WebBrowser.ExecWB实现

ie浏览器预览时要把不需要预览的div加上class="noprint",否则会整个页面全部预览

打印时则只打印调用printit方法时传入的div层

<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <style>    
	@media print {  
		.noprint {   
			display: none   
		}  
	}  
  </style>  
  <script language="javascript">
	   //提示窗口
	   function printit(MyDiv,type){
			if(type=='Preview'&&!-[1,]){   
				document.all.WebBrowser.ExecWB(7,1);
			}else{                                   
	 　　      var newstr = document.getElementById(MyDiv).innerHTML;
	 　　      var oldstr = document.body.innerHTML;
	 　　      document.body.innerHTML = newstr;
	 　　      window.print();
	 　　      document.body.innerHTML = oldstr;
				return false;
			}
	   }
  </script>
 </HEAD>
 
 <BODY>
  
	<span id='div1'>把要打印的内容放这里</span></br> </br> 
	 
	<span class="noprint" >不打印的内容放这里</span>  </br>  </br> 
	 
	<OBJECT classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height="0" id="WebBrowser" width="0" VIEWASTEXT></OBJECT>

	<input type="button" value="预览" onclick="javascript:printit('div1','Preview');">
	<input type="button" id="button_print" name="button_print" value="打印本单据" onclick="javascript:printit('div1','print');">
 </BODY>
</HTML>

 

 

1
顶
0
踩
分享到：
评论
1 楼 July01 2017-09-26  
推荐用StratoIO打印控件，浏览器和系统的兼容性都很好，而且不会崩溃。参考http://webprint.stratoio.com/features
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics