精华内容
下载资源
问答
  • React实现浏览器打印部分内容

    千次阅读 2019-05-14 20:05:34
    React 浏览器打印

    近期着手项目任务的打印功能,在此作个记录,本文介绍基于React的一种调用浏览器打印页面指定内容的方法。

    整体思路: 通过构建一个隐藏的元素(该元素包裹需打印的内容),当打印行为触发时,将页面其他的一些不需要打印的元素隐藏,然后将需打印的元素追加到body中,打印完成后,再恢复初始状态即可。浏览器打印的本质还是将web页面中的元素打印出来而已。

    1. 构建待打印元素

    在页面中构建一个display为none的元素,里面的内容为你需要打印的内容。我们还需要设置包裹打印内容的元素的ref属性,以便于后面获取到元素。

    <div style={{ display: 'none' }}>
    	<div ref={el => (this.printRef = el)}>
    	{ 打印内容 }
    	</div>
    </div>
    

    2. 打印动作触发时的处理

    处理流程:

    1. 获取待打印元素;
    2. 将根元素隐藏;
    3. 将待打印元素追加到body中;
    4. 调用浏览器的打印预览;
    5. 预览界面关闭后,将待打印元素从body中移除,将原始页面恢复。
    let printView = this.state.printRef  //获取待打印元素
    document.querySelector('#root').className = 'print-hide'  //将根元素隐藏
    document.body.appendChild(printView) //将待打印元素追加到body中
    window.print() //调用浏览器的打印预览
    document.body.removeChild(printView) //将待打印元素从body中移除
    document.querySelector('#root').className = '' //将原始页面恢复
    

    对应的CSS设置:

    @page {
      size: A4;
      margin: 0;
    }
    @media print {
    	html, body {
    	    min-width: 0;
    	    width: 210mm; 
    	    height: 297mm;
    	}
    	.print-hide {
    		visibility: hidden!important;
    		display: none!important;
    	}
    }
    

    其中,@page中的size可以自己设置纸张的大小,如果是A4纸可以直接设置值为A4,媒体查询@media print中设置的是打印时的样式,因为打印设备知道其输出区域的物理大小,所以使用厘米(cm)、毫米(mm)、英寸(in)等作为打印设计的单位完全可行。

    补充(其他原生的打印方法)

    1. 直接替换body的内容为要打印的内容,之后再重新刷新页面。
    const old = window.document.body.innerHTML //备份原来的页面
    window.document.body.innerHTML = ''
    window.document.body.appendChild(/* 将你要打印的内容附加到这 */)
    window.print() //调用print()函数时,会跳出打印预览的界面,以下的代码被阻塞,关闭预览界面后继续执行
    window.document.body.innerHTML = old
    window.location.reload() //重新加载旧页面
    
    1. 打开一个新窗口,将打印内容放到新窗口打印,打印结束后关闭新窗口
    const newWindow = window.open("打印窗口", "_blank")
    const docStr = '<div>test</div>'  //需要打印的内容
    newWindow.document.write(docStr)
    const styles = document.createElement("style")
    styles.setAttribute('type', 'text/css') //media="print"
    styles.innerHTML = ''
    newWindow.document.getElementsByTagName('head')[0].appendChild(styles)
    newWindow.print()
    newWindow.close()
    

    以上两种方法可能会造成CSS样式应用无效的问题。

    3. 注意点

    1. 第二小节的步骤2中的意思是:将页面中所有不需要打印的元素隐藏,特别注意像模态窗Model这些元素,也要为它们加上'print-hide'className属性。
    2. 如果需要在特定位置强制分页打印,可以尝试在对应元素上设置page-break-before:always !importantpage-break-after:always !importantCSS属性,该属性只对块级元素有效(这个非常重要,就被这个坑了)。
    3. 进入打印预览后,我们无法获知用户最终是选择了打印,还是选择了取消。这里若有人知道解决方法的话,欢迎留言。
      web打印选项
    4. JS能实现谷歌和IE浏览器打印预览,火狐不行,火狐浏览器对于JS的操作权限有极为严格的限制,其基本原则是JS无法操作页面外事务,可以试试用JS调用HTML5机制模拟打印界面输出到打印机,不通过浏览器来完成。
    5. 在使用口袋打印机(喵喵机)打印,如果打印内容有二维码的时候,要注意二维码的分辨率问题。(我就踩了一个坑:二维码组件生成二维码,默认是以canvas的形式,这样打印出来导致整个内容模糊,改成svg就可以清晰打印了)

    若对你有帮助,可以支持一下作者创作更多好文章哦~
    赞赏码

    展开全文
  • 如何打印qq文件的正文部分

    千次阅读 2017-10-16 09:44:26
    又到了offer高收季了,前几天,因为朋友收到邮件,收需要打印qq邮件正文部分,而且不是全部打印正文,需要打印选定部分的正文,于是自己就摸索了一下,虽然还是麻烦,但是还是比较快的,相比于传统的Ctrl+C和Ctrl+V...

    又到了offer高收季了,前几天,因为朋友收到邮件,收需要打印qq邮件正文部分,而且不是全部打印正文,需要打印选定部分的正文,于是自己就摸索了一下,虽然还是麻烦,但是还是比较快的,相比于传统的Ctrl+C和Ctrl+V操作,本方法还是比较简单的(至少不用再去大调邮件中文本的格式了)。PS:正文,正文,仅仅是正文,打印附件的话,下载下来打印就可以了。

    使用工具:

    qq邮箱,Word文档

    1、首先打开你所需要的邮件,随便打开一封邮件,点击下面红色框框里面的展开按钮。


    2、点击导出为eml文件


    3、下载下来


    4、下载过后得到如下类型的文件,右键打开方式,选择Word方式打开,我们便可以看到我们所需要的正文了。


    5、下面就是打开Word过后了


    6、如上所示Word文档中的格式和邮件中的格式大体一致,只需要微调就可以了,当然,你也可以删除一部分内容保存你想要的内容。

    7、在Word中的打印也就很简单了赛,直接Ctrl+P即可解决了。

    PS:其实大家可能会注意到,在qq邮件中点击第1步的展开按钮过后,也是有打印选项的。


    但是这种方式打印的话只能打印整个内容,而且连收件人发件人也会显示。当然需求不一样,这种方法也是阔以滴。


    展开全文
  • 而一般情况下,打印时选择的打印机是默认打印机,打印页面范围是所有页面,如果要选择其他打印机或打印部分页面,需要对代码进行一定的设置。通过在百度和各大网站上查找资料,终于在MSDN上找到了一个解决方案,我把...

    最近在逛国外各大编程社区论坛的时候,发现很多人都在问一个关于PDF文件打印的问题:打印时如何选择非默认打印机并设置打印页面的范围。而一般情况下,打印时选择的打印机是默认打印机,打印页面范围是所有页面,如果要选择其他打印机或打印部分页面,需要对代码进行一定的设置。我在这里分享一个解决方案,让其他有同样需求的朋友少走点冤枉路。

    在这个解决方案中我使用了一个免费的PDF控件,感兴趣的朋友可以在Codeplex官网:https://freepdf.codeplex.com上下载。

    下面是该解决方案的详细代码分步解析:

    第一步:添加项目引用。

    安装控件后,创建一个新的项目,找到控件的安装目录,在项目的“解决方案”窗口右击->添加引用,选择和项目.NET Framework版本对应的dll文件进行添加;
    如下图:
    这里写图片描述

    第二步:使用命名空间。

    在该方案中,我使用的命名空间如下:

    using Spire.Pdf;
    using System.Windows.Forms;
    using System.Drawing.Printing;

    第三步:创建一个新的PDF文档,并加载待打印的PDF文件。

    PdfDocument doc = new PdfDocument();
    doc.LoadFromFile("sample.pdf");

    如果需要使用默认打印机打印所有页面,请看第四步。如果需要使用其他打印机并设置打印页面范围,请看第五步。

    第四步:使用默认打印机打印所有页面。

    doc.PrintDocument.Print();

    第五步:选择打印机和设置打印页面范围。

    PrintDialog dialogPrint = new PrintDialog();
    dialogPrint.AllowPrintToFile = true;
    dialogPrint.AllowSomePages = true;
    dialogPrint.PrinterSettings.MinimumPage = 1;
    dialogPrint.PrinterSettings.MaximumPage = doc.Pages.Count;
    dialogPrint.PrinterSettings.FromPage = 1;
    dialogPrint.PrinterSettings.ToPage = doc.Pages.Count;
    
    if (dialogPrint.ShowDialog() == DialogResult.OK)
        {
            //设置打印的起始页码
            doc.PrintFromPage = dialogPrint.PrinterSettings.FromPage;
            //设置打印的终止页码
            doc.PrintToPage = dialogPrint.PrinterSettings.ToPage;
            //选择打印机
            doc.PrinterName = dialogPrint.PrinterSettings.PrinterName;
    
            PrintDocument printDoc = doc.PrintDocument;
            dialogPrint.Document = printDoc;
            printDoc.Print();
        }

    运行项目,输出的效果图如下(打印机和打印页面范围可以自己选择):

    这里写图片描述

    全部代码如下:

    using Spire.Pdf;
    using System.Windows.Forms;
    using System.Drawing.Printing;
    
    namespace PrintPDF
    {
        class Program
        {
            static void Main(string[] args)
            {
                PdfDocument doc = new PdfDocument();
                doc.LoadFromFile("sample.pdf");
    
                //Use the default printer to print all the pages
                //doc.PrintDocument.Print();
    
                //Set the printer and select the pages you want to print
    
                PrintDialog dialogPrint = new PrintDialog();
                dialogPrint.AllowPrintToFile = true;
                dialogPrint.AllowSomePages = true;
                dialogPrint.PrinterSettings.MinimumPage = 1;
                dialogPrint.PrinterSettings.MaximumPage = doc.Pages.Count;
                dialogPrint.PrinterSettings.FromPage = 1;
                dialogPrint.PrinterSettings.ToPage = doc.Pages.Count;
    
                if (dialogPrint.ShowDialog() == DialogResult.OK)
                {
                    doc.PrintFromPage = dialogPrint.PrinterSettings.FromPage;
                    doc.PrintToPage = dialogPrint.PrinterSettings.ToPage;
                    doc.PrinterName = dialogPrint.PrinterSettings.PrinterName;
    
                    PrintDocument printDoc = doc.PrintDocument;
                    dialogPrint.Document = printDoc;
                    printDoc.Print();
                }
            }
        }
    }
    展开全文
  • 前提条件:用AD打开所需要打印的PCB图纸 第1步: file---pagesetup,第2部为修改后的内容,具体如下: ...第2步,哪个层不需要,右击删除即可:第3步:file-print-预览是自己想要的结果就可以打印了 ...

    前提条件:用AD打开所需要打印的PCB图纸

    第1步:

    file---pagesetup,第2部为修改后的内容,具体如下:

     

    第2步,哪个层不需要,右击删除即可:第3步:file-print-预览是自己想要的结果就可以打印了

    展开全文
  • 可以在GitHub上下载打印插件,但是自己写更简单,所以我就自己写了 本例为打印网页上的一个表格 window.print()打印的是整个网页的HTML内容,不包括CSS @media print{ ... }可以设置打印时样式 正文 网页效果: ...
  • 本文转自:... 自己负责的模块需要有个试卷打印的功能,需要将网页特定范围内的内容打印出来,所以选择了jquery.jqprint脚本 用起来也非常简单。  //打印  $("#printPage").jqprint({  de
  • EXCEl有自动调整行高的功能,但是自动调整的行高十份紧凑,打印时会出现部分行的字下半截看不见的问题。 行不多时,可以手动调整行高,但行数超过百行后,手动工作量太大, 现使用VBA的方式进行批量调整行高,对微软...
  • 但是您知道如何使用自己的桌面3D打印打印自己的身体器官模型吗?这是几乎任何FDM 3D打印机都能够做到的。近日,谷歌公司的一位软件工程师 Luis Ibáñez(博客地址)推出了一个非常有趣的个性化项目:3
  • 十种常用的设计模式(大部分自己总结,部分摘抄)

    万次阅读 多人点赞 2017-05-05 13:29:22
    最近公司需要重构一下老项目,所以重新总结了下一些常用的设计模式。(有些内容摘自互联网)
  • Android蓝牙打印二维码打印外卖单打印

    千次阅读 热门讨论 2015-12-24 15:07:23
    公司在做一个类似美团,饿了么的平台, 所以就会涉及小票打印, 自己懒也难得自己重头开始研究, 就去网上各种找demo,... 大部分代码都不是自己写的啦, 写这个博客也是为了希望能帮到跟我一样正在奋斗的小码农~~废话不多
  • 如何比较两个list数组,并且把不同的部分输出打印 第一个数组,是从数据库中查到的:while(rs.next()){ nsrsbhName.put(rs.getString("b"),rs.getString("a")); } nsrsbhList.add(nsrsbhName); //将...
  • 自己开发基于Web的打印控件,真正免费不是共享

    万次阅读 热门讨论 2009-09-02 14:08:00
    1.1.0.121 版的控件,更新如下 SetPrintBackground 已被取消 SetMediaHeader 去掉了两个参数,见被划掉的文字部分 在做项目中发现要用到Web方面的打印,于是从网上搜索了一些相关的web打印控件,有scriptx,...
  • 在MFC中手动实现打印功能很麻烦,如果不需要打印预览功能,可以直接用office文件作为打印模板,在程序中直接打印文件,这样实现简单方便,这种方案对于经常需要更改模板内容的话,还是一个不错的选择。在Winform中...
  • MFC打印 打印预览

    千次阅读 2012-12-11 14:51:41
    这两篇文章是我看了那么多写MFC打印功能中介绍的相对较好的,所以转载了过来,以方便自己以后学习使用 前段时间需要将日志信息通过打印机打印出来。 总结了一下其中的一些用法: 1:用CPrintDialog 可以呼出...
  • JS实现浏览器打印打印预览

    千次阅读 2019-05-10 17:39:19
    JS实现浏览器打印打印预览 1.JS实现打印的方式方式一:window.print()window.print();会弹出打印对话框,打印的是window.document.body.innerHTML中的内容,下面是从网上摘到的一个局部打印的例子,该...
  • Printer标准ES-POS命令打印,固定IP或蓝牙打印,支持黑白图片打印预览 项目Github Bintray要求 minSdkVersion 5 <uses-permission android:name="android.permission.BLUETOOTH"
  • NPOI打印设置

    千次阅读 2017-12-22 13:20:17
    打印设置主要包括方向设置、缩放、纸张设置、页边距等。NPOI 1.2支持大部分打印属性,能够让你轻松满足客户的打印需要
  • 日志打印

    千次阅读 2017-11-13 11:16:56
    项目出问题时,你要能拿出Log证明自己负责的部分没有问题,如果是自己的问题,要从Log里快速找出错误原因。如果没有从Log里找出错误原因,那一定是一件很悲催的事情,特别是在bug不容易重现的情况下。 哪些地方打...
  • 在我的Blender 3D打印入门系列的第1部分中,我介绍了基本的初步步骤,这些步骤为建立自己的3D模型并准备好进行3D打印而设置Blender环境。 在第2部分中,我检查了创建这些模型的过程。 现在,让我们看一下高级技巧,...
  • 漫谈程序员系列:3D打印打印出程序猿吗

    万次阅读 多人点赞 2014-10-14 07:50:10
     3D打印,即快速成型技术的一种,它是一种以数字模型文件为基础,运用粉末状金属或塑料等可粘合材料,通过逐层打印的方式来构造物体的技术。  3D打印通常是采用数字技术材料打印机来实现的。常在模具制造、工业...
  • pytorch冻结部分参数训练另一部分

    万次阅读 多人点赞 2019-05-20 10:09:33
    比如加载了resnet预训练模型之后,在resenet的基础上连接了新的模快,resenet模块那部分可以先暂时冻结不更新,只更新其他部分的参数,那么可以在下面加入上面那句话 class RESNET_MF(nn.Module): def _...
  • 打印数字

    千次阅读 2017-04-25 21:16:45
    打印数字小明写了一个有趣的程序,给定一串数字。 它可以输出这串数字拼出放大的自己的样子。 比如“2016”会输出为: 22222 00000 1 6666 2 2 0 0 1 1 6 2 0 0 1 666666 2 0 0 1 6 6 2 0 0 1
  • JS 实现浏览器打印打印预览

    千次阅读 2017-02-28 10:18:37
    目前正在做浏览器端采用JS方式实现打印这么一个功能,JS打印实现的方法很多,但是兼容各个浏览器实现打印预览的功能有些棘手,现将实现的内容及遇到的问题记录下来,希望有大牛看到所提的问题后可以给予解答,在此...
  • print demo .noprint { display: none; } function doPrintSetup... //打印设置 printWB.ExecWB(8, 1) } function doPrintPreview() { //打印预览 printWB.ExecWB(7,
  • 打印管理

    千次阅读 2012-10-10 10:49:36
    目标 ...不过在1999年随着CUPS的出现,这种局面得到改观,所有的Unix及Linux都可以使用此打印系统,以支持用户的各种打印需求。我们在本章会了解到Unix的传统打印方式,而着重的是新兴的CUPS打印系统。
  • 打印沙漏

    千次阅读 2015-09-02 15:34:33
    1.题目描述自测-1 打印沙漏 (20分) 本题要求你写个程序把给定的符号打印成沙漏的形状。例如给定17个“*”,要求按下列格式打印 所谓“沙漏形状”,是指每行输出奇数个符号;各行符号中心对齐;相邻两行符号数差2...
  • 我们打印日志的时候都很随意,可是用的时候会吐槽各种 SB 包括自己!写好每一条日志吧,与君共勉! 一、日志 1.1、日志是什么? 日志,维基百科的定义是记录服务器等电脑设备或软件的运作。日志文件提供精确的...
  • java实现打印功能

    千次阅读 2018-03-15 13:26:35
    前言在我们的实际工作中,经常需要实现打印功能。但由于历史原因,Java 提供的打印功能一直都比较弱。实际上最初的 jdk 根本不支持打印,直到 jdk1.1 才引入了很轻量的打印支持。所以,在以前用 Java/Applet/JSP/...
  • C# PrintDocument打印

    万次阅读 2012-04-24 16:10:51
    C# PrintDocument打印 前段时间开发项目时接触到了打印模块,以前做的打印都是托管指令集打印([DllImport(...因为搜集到的资料有绝大部分都很浪费口舌,且代码难易度不适合初学者,索性,写一个来巩固自己,也可顺

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 429,834
精华内容 171,933
关键字:

怎么打印自己需要的部分