javascript 调用浏览器的打印方法。并设置打印为横向打印

来源：互联网发布：51单片机原理及应用pdf 编辑：程序博客网时间：2024/05/24 15:41

最近做一个简单的打印功能，要使用JavaScript调用浏览器的打印功能。并设置打印为横向打印：
为了适应A4纸的宽和高这里设置：

body{margin:0 auto;              width: 1010px;          height: 369px;     }

为了在页面做一个打印的按钮，但是在真实打印的时候该按钮又不能显示在打印页面上，这里我加了两个标识性的注释

<!--begin--><!--end-->

并写了一个打印的方法，在调用该方法是截取掉打印中不需要显示的内容，只包括标识性标签中的内容：

<script type="text/javascript">            function printit(){                if (confirm('确定打印吗？')){                    try{                        print.portrait   =  false    ;//横向打印                     }catch(e){                        //alert("不支持此方法");                    }                     var bdhtml=window.document.body.innerHTML;//获取当前页的html代码                            var sprnstr="<!--begin-->";//设置打印开始区域                            var eprnstr="<!--end-->";//设置打印结束区域                            var prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)); //从开始代码向后取html                            var prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html                            window.document.body.innerHTML=prnhtml;                            window.print();                            window.document.body.innerHTML=bdhtml;                    }            }        </script>

实例展示：

<style type="text/css">     body{margin:0 auto;              width: 1010px;          height: 369px;          }</style>    <head>    <title>打印标题</title>        <script type="text/javascript">            function printit(){                if (confirm('确定打印吗？')){                    try{                        print.portrait   =  false    ;//横向打印                     }catch(e){                        //alert("不支持此方法");                    }                     var bdhtml=window.document.body.innerHTML;//获取当前页的html代码                            var sprnstr="<!--begin-->";//设置打印开始区域                            var eprnstr="<!--end-->";//设置打印结束区域                            var prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)); //从开始代码向后取html                            var prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html                            window.document.body.innerHTML=prnhtml;                            window.print();                            window.document.body.innerHTML=bdhtml;                    }            }        </script>        <style type="text/css">            .ipt{                cursor: pointer;            }        </style>    </head>   <body>            <OBJECT id="WebBrowser"  classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height=0 id=wb name=wb width=3></OBJECT>                  <div id="kpr" style="margin:30px">                  <input class="ipt" type="button"  value="打印"           onclick ="javascript:printit();">                  <input class="ipt" type="button"   value="关闭"           onclick ="javascript:window.close();">                </div>     <!--begin-->            <h3>打印标题</h3>           <table>               <tr>                  <td>内容</td>                  <td>内容</td>                  <td>内容</td>                  <td>内容</td>                  <td>内容</td>                  <td>内容</td>                  <td>内容</td>                  <td>内容</td>               </tr>               <tr>                  <td>内容2</td>                  <td>内容2</td>                  <td>内容2</td>                  <td>内容2</td>                  <td>内容2</td>                  <td>内容2</td>                  <td>内容2</td>                  <td>内容2</td>               </tr>           </table>     <!--end-->    </body>

预览：
页面预览时显示打印和关闭按钮

打印效果，点击打印按钮–>确定：
打印是不显示两个按钮

0 0