js 打印功能-优快云博客

本文介绍了三种网页打印的方法：纯JS实现的局部打印、调用Windows底层的整页打印（不推荐）、以及利用jQuery插件实现的局部打印。每种方法都提供了具体的代码示例。

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

方法多多，自己收集一下

1、js实现（可实现局部打印）

    Html代码   
    
  
 <input id="btnPrint" type="button" value="打印" onclick="javascript:window.print();" />  
   
 <input id="btnPrint" type="button" value="打印预览" onclick=preview(1) />  
 <style type="text/css" media=print>  
 .noprint{display : none }  
 </style>  
   
   
 <p class="noprint">不需要打印的地方</p>  
   
 <script>  
 function preview(oper)         
 {  
 if (oper < 10)  
 {  
 bdhtml=window.document.body.innerHTML;//获取当前页的html代码  
 sprnstr="<!--startprint"+oper+"-->";//设置打印开始区域  
 eprnstr="<!--endprint"+oper+"-->";//设置打印结束区域  
 prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取html  
   
 prnhtmlprnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html  
 window.document.body.innerHTML=prnhtml;  
 window.print();  
 window.document.body.innerHTML=bdhtml;  
 } else {  
 window.print();  
 }  
 }  
 </script>  
 <p>XXXXX</p>  
 <!--startprint1-->要打印的内容<!--endprint1-->  
   
 再加个打印按纽 onclick=preview(1)   

2、调用windows底层打印，报安全警告，不建议使用（不支持局部打印）

    Html代码   
    
  
 <HTML>  
 <HEAD>  
 <TITLE>javascript打印-打印页面设置-打印预览代码</TITLE>   
 <META http-equiv=Content-Type content="text/html; charset=gb2312" />   
 <SCRIPT language=javascript>    
 　　function printsetup(){    
 　　// 打印页面设置    
 　　wb.execwb(8,1);    
 　　}    
 　　function printpreview(){    
 　　// 打印页面预览    
 　　　　    
 　　wb.execwb(7,1);  　　　　　    
 　　　　    
 　　}    
   
 　　function printit()    
 　　{    
 　　if (confirm('确定打印吗？')) {    
 　　wb.execwb(6,6);   
 　　}    
 　　}    
 　　</SCRIPT>   
 </HEAD>   
 <BODY>   
   
 <DIV align=center>   
 <OBJECT id=wb height=0 width=0    
 classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 name=wb></OBJECT>   
 <INPUT onclick=javascript:printit() type=button value=打印 name=button_print />    
 <INPUT onclick=javascript:printsetup(); type=button value=打印页面设置 name=button_setup />    
 <INPUT onclick=javascript:printpreview(); type=button value=打印预览 name=button_show />    
 一按开始的减肥了卡时间段  
 </DIV>   
 </BODY>   
 </HTML>   

3、jQuery实现（支持局部打印）

    Html代码   
    
 <script type="text/javascript" src="jquery-1.4.2.min.js"></script>   
 <script type="text/javascript" src="jquery.PrintArea.js"></script>   
 <script>  
 $(document).ready(function(){  
   $("input#biuuu_button").click(function(){  
   
   $("div#myPrintArea").printArea();  
   
 });  
 });  
    
 </script>  
    
 <input id="biuuu_button" type="button" value="打印"></input>  
   
 <div id="myPrintArea">.....文本打印部分.....</div>