js 打印

js 实现调用打印功能

css 隐藏打印时不展示的元素通过  @media print

<style type="text/css">
  @media print {
    .noprint{
      display: none;
    }
  }
</style>

html

<!--startprint1-->
    <h1 style="text-align: center;">这里是打印1的内容</h1>
    <p style="text-indent: 2em;">这里是内容内容内容</p>
    <div class="noprint">打印不可见</div>
<!--endprint1-->
<!--startprint2-->
    <h1 style="color:red;">这里是打印2的内容</h1>
    <div class="noprint">打印不可见</div>
<!--endprint2-->
<!--startprint11-->
    <h1 style="color:blue;">这里是打印11的内容</h1>
    <div class="noprint">打印不可见</div>
<!--endprint11-->
<input type='button' name='button_export' title='打印1' onclick=preview(1) value='打印1'>
<input type='button' name='button_export' title='打印2' onclick=preview(2) value='打印2'>
<input type='button' name='button_export' title='打印11' onclick=preview(11) value='打印11'>

<script language="javascript">
function preview(fang){
    if (fang < 5){
        bdhtml=window.document.body.innerHTML;//获取当前页的html代码
        sprnstr="<!--startprint"+fang+"-->";//设置打印开始区域
        eprnstr="<!--endprint"+fang+"-->";//设置打印结束区域
        prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取html
        prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html
        window.document.body.innerHTML=prnhtml;
        window.print();
        window.document.body.innerHTML=bdhtml;
    } else {
        window.print();//方法用于打印当前窗口的内容。
    }
}
</script>