打印window.print()

最新推荐文章于 2024-04-16 10:30:05 发布

荒安俞

最新推荐文章于 2024-04-16 10:30:05 发布

阅读量327

点赞数

分类专栏： window.print 文章标签： html js

本文链接：https://blog.csdn.net/qq_15007327/article/details/110955121

版权

window.print 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

之前公司要求做印刷，网上查了很多方法，然后实现了，偶然间发现了一个新的方法，和大家分享一下

这是一个全部页面打印的方法，

当然打印前，可以把不需要的hide

打印结束后，把它还原回来

想要分页打印的话用 css 控制就行（当然可以通过算法控制css,进行分页）

page-break-after or page-break-before 具体使用方法请百度

<style>
/** 这个用来控制打印的内容，距离页边距离的*/
@page{
    margin-top:20px;
    margin-left:20px;
    margin-right:20px;
    margin-bottom:10px;
}
</style>
<body>
   <div id="btnDiv" style="float:left;">
        <!-- 印刷-->
        <button id="printBtn" type="button" class="btn btn-default" style="width:110px;height:25px;padding: 0 0;font-size:12px;font-weight:bold;" onclick="printPage()">
            print
        </button>
   </div>
   <div><!-- 印刷的内容-->
        <div>xxx</div>
        <div>xxx</div>
        <div>xxx</div>
        <div>xxx</div>
   </div>
   <OBJECT ID="WB" WIDTH="0" HEIGHT="0" CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">
   </OBJECT>
</body>
<script>
function printPage() {
    // 印刷前把用不到的部分hide
    $("#btnDiv").css("display","none");
    //之前在EDGE下不支持  不知道是不是Edge版本太低 现在新的的Edge用的内核是谷歌的 未测试
    // 但是该方法在IE下是支持的
    // document.WB.ExecWB(6,1);
    
    // 这个方法EDGE 和 IE都支持
    window.print();
    // 印刷后把用不到的部分还原
    $("#btnDiv").css("display","block");
}
</script>

荒安俞

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
打印window.print()

之前公司要求做印刷，网上查了很多方法，然后实现了，偶然间发现了一个新的方法，和大家分享一下想要分页打印的话用 css 控制就行page-break-after orpage-break-before具体使用方法请百度<body> <div id="btnDiv" style="float:left;">  <button id="printBtn" type="button" class...
复制链接

扫一扫