js调用打印当前页的两种方法

最新推荐文章于 2024-07-11 08:47:19 发布

bird_cat

最新推荐文章于 2024-07-11 08:47:19 发布

阅读量5k

点赞数

分类专栏： javascript

本文链接：https://blog.youkuaiyun.com/topwqp/article/details/8226976

版权

javascript 专栏收录该内容

7 篇文章

订阅专栏

本文详细介绍了如何在网页中实现打印功能，并通过引入二次打印插件提升用户体验。主要内容包括两种方法：一种是利用JavaScript直接操作DOM元素实现打印预览与打印功能；另一种则是借助二次打印插件，通过特定的CAB文件实现更为灵活和专业的打印解决方案。文章旨在为开发者提供实用的网页打印技术指导。

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

方法一：

<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<%@ page contentType="text/html; charset=GBK"%>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title></title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript">
	function dy(){
		bdhtml=window.document.body.innerHTML; 
		sprnstr="<!--startprint-->"; 
		eprnstr="<!--endprint-->"; 
		prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17); 
		prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr)); 
		window.document.body.innerHTML=prnhtml;
		document.getElementById("dis").style.display="none";
		window.print();
		document.getElementById("dis").style.display="block";
	}
	</script>
  </head>
 
  <body>
  	<!--startprint-->
    <table width="80%" align="center">
        <tr id="dis">
        	<td align="right">
        		<input type="button" οnclick="dy()" value="打印"/>
        	</td>
        </tr>        
    
    </table>
    <!--endprint-->
  </body>
</html>

方法二：

<%@ page language="java" import="java.util.*" pageEncoding="gbk"%>
<%@page import="cn.edu.tsinghua.yjszs.bm.vo.Dyzkz" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<object id="factory" style="display: none"
			classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
			codebase="././smsx/smsx.cab#Version=6,5,439,30" viewastext></object>

<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>打印</title>
</head>
<script language="javascript">
function dy(){
   
 
	document.getElementById("disp").style.display="none";	
	factory.printing.portrait = false; //portrait是指打印方向，设置为true就是纵向，false就是横向。 
	
	factory.DoPrint(true); //设置为false，直接打印 
	
	document.getElementById("disp").style.display="block";

}
</script>
<body>
//这个隐藏的iframe用于向后台传入数据，传输数据的同时页面不进行跳转。
<iframe name="hideIframe" width=0 height=0></iframe>
<form action="bm.yz_bs_qkb.do" method=post target="hideIframe" id="subform" name="subform">
<input type="hidden" name ="m" id="m"/>
</form>


<div style="width: 900px;height: 600px">
<div id="disp" style="float:left; width:100%; height:10%">
	<table>
		<tr>
			<td>
				<input type="button" value="打印" οnclick="dy()"/>
			</td>
		</tr>
	</table>
</div>

第二种方法需要插件：smsx.cab

这是插件地址：http://download.youkuaiyun.com/detail/topwqp/4813265