zoukankan      html  css  js  c++  java
  • 关于打印

    要实现网页打印其实很简单,一个window.print(); 就可以了。 但是往往需求中要求我们打印的不是整个页面,而是部分有用的东西。而window.print();只能打印整个页面。这时就需要分区域的打印。目前发现有以下几种方法。先记成笔记,万一以后忘记了可以再来查阅。

    1、CSS控制在打印时不需要打印的部分隐藏起来

      (1) bootstrap中的hidden-print可以在打印时将不需要显示的部分隐藏起来。在那一部分的最外层dom元素中加上 class="hidden-print" 即可。

      (2) 

    @media print {
        .notPrint{ display: none; }  
    }
    

      用@media print将需要隐藏部分display: none; 也可以。此方法还可以修改打印时的样式。

    2、JS拼接字符串的方法将需要打印的地方拼接起来。以下是前段时间项目中打印的代码:

    var wHtml=document.body.innerHTML; //先将页面dom保存起来 
    var printData=$('#CC-orderDetial').html(); //构造需要打印部分
    document.body.innerHTML = printData;  /将需要打印部分赋值给当前页面
    window.print();  //打印
    document.body.innerHTML=wHtml;  //还原原来的页面
    document.location.reload();
    return false; 

    以上几种方法虽然可以实现部分打印,但还隐藏着一个小bug。如果需要打印部分有<a href="www.aaa.com">XXX</a>, 你在chrome打印预览的时候会发现href中的内容也会被打印出来。把href="www.aaa.com" 替换成空格即可。bbb.replace(/href=/g,"");

  • 相关阅读:
    D3.js:交互式操作
    D3.js:Update、Enter、Exit
    D3.js:动态效果
    D3.js:完整的柱形图
    D3.js:坐标轴
    D3.js
    ES 6 : 数组的扩展
    ES 6 : Math对象的扩展
    拉勾网企业图片列表效果
    拉勾网图片切换效果
  • 原文地址:https://www.cnblogs.com/mmkan/p/6237081.html
Copyright © 2011-2022 走看看