精华内容
下载资源
问答
  • 网页打印部分内容打印

    千次阅读 2009-08-11 09:07:00
    网页打印(部分内容打印) ...但我现在想说的是只打印一部分,如我们的网页想统一风格,每页都有头、导航和脚等东西,这些我不想打印,只想把内容区域中的一张表格打印出来,怎么办?一、HTML代码,注意那两行注释: 

    网页打印(部分内容打印)

     

            我们做的页面需打印怎么办?简单地直接用javascript调用window.print()就ok!当然想打印更好看一点就CSS罗。但我现在想说的是只打印一部分,如我们的网页想统一风格,每页都有头、导航和脚等东西,这些我不想打印,只想把内容区域中的一张表格打印出来,怎么办?

    一、HTML代码,注意那两行注释:

    <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">   
           
        <!--startprint-->
        <asp:GridView ID="GridView1" runat="server" Width="157px" EnableViewState="False">
        </asp:GridView>
        <!--endprint-->   
       
        <br/>
        <div style="width:100%; text-align:center;">
            <input type="button" value="打印表格" οnclick="PrintView();" />
        </div>     
       
    </asp:Content>

     

    二、Javascript:

        function PrintView(){
            var bdhtml=window.document.body.innerHTML;
            //alert(bdhtml.length);//4619
            var sprnstart="<!--startprint-->";
            var sprnend="<!--endprint-->";
            //alert(bdhtml.indexOf(sprnstart)+17);//582
            var sprnhtml=bdhtml.substring(bdhtml.indexOf(sprnstart)+17,bdhtml.length);               
            //alert(sprnhtml.indexOf(sprnend));//3246
            sprnhtml=sprnhtml.substring(0,sprnhtml.indexOf(sprnend));
            window.document.body.innerHTML=sprnhtml;
            window.print();
                   
            /*开新窗口打印尚未实现
            var printwin=window.open("print.html");
            printwin.document.body.innerHTML=sprnhtml;
            printwin.print();
            */       
        }

    三、OK

    展开全文
  • 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就可以清晰打印了)

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

    展开全文
  • Excel中工作表内容过宽,超出A4纸打印范围,只能打印一部分,怎么解决这个问题 悬赏分:0 | 解决时间:2007-1-27 13:30 | 提问者:汤雅晴 最佳答案 1、缩小你的工作表行宽 2、视图——分页预览 把打印...
    Excel中工作表内容过宽,超出A4纸打印范围,只能打印出一部分,怎么解决这个问题 悬赏分:0 | 解决时间:2007-1-27 13:30 | 提问者:汤雅晴 最佳答案 1、缩小你的工作表行宽 2、视图——分页预览 把打印范围的边框拉到你的工作表边上,使其能显示在第一页上。
    展开全文
  • window.print()打印页面部分内容

    千次阅读 2011-11-04 09:54:18
    window.print() 实际上,是浏览器打印功能菜单的种程序调用。与点击打印功能菜单一样,不能精确分页,不能设置纸型,套打的问题更加无从谈起,只不过,可以让用户不用去点菜单,直接点击网页中的个按钮,或个...
    window.print()  实际上,是浏览器打印功能菜单的一种程序调用。与点击打印功能菜单一样,不能精确分页,不能设置纸型,套打的问题更加无从谈起,只不过,可以让用户不用去点菜单,直接点击网页中的一个按钮,或一个链接里面调用罢了。事实上,很多用户都是采用这种方式打印,但是这种方式最致命的缺点是不能设置打印参数,比如纸型,页边距,选择打印机等等。
    
    需要指出的是这种方法提供一个打印前和打印后的事件onbeforeprint、onafterprint。可以在打印前的时候重新编辑一些格式,专门送去打印,打印后又处理回来。
    function window.onbeforeprint()
    {
    //将一些不需要打印的隐藏
    }
    function window.onafterprint()
    {
    //放开隐藏的元素
    }

    通过这两个方法,就可以实现页面的部分打印

     

    调用window.print()时,可以利用css来控制页面中的东西是否显示
    <style>
    @media print{
      .noprint{
         display:none
      }
    }
    </style>


    HTML如下:
    <table width="757" height="174" border="0" align="center"cellpadding="0"
    cellspacing="0">
     <tr class="noprint">
      <td height="133" align="center" valign="top">
       <img src="Images/top.jpg" width="757" height="133"></td>
     </tr>
    </table>
    此时<tr class="noprint">是不打印的tr

    下面是media的相关
    media类型是CSS属性媒体类型,用于直接引入媒体的属性。其语法格式如下:
    @media screen | print | projection | braille | aural | tv | handheld | all
    参数说明
        screen:指计算机屏幕。
        print:指用于打印机的不透明介质。
        projection:指用于显示的项目。
        braille:盲文系统,指有触觉效果的印刷品。
        aural:指语音电子合成器。
        tv:电视类型的媒体。
        handheld:指手持式显示设备。
        all:用于所有媒体。

     

    要打印页面指定内容可以通过使用样式表来实现,楼上的回答虽然也可以实现只打印部分内容,但前提是打印的内容都在你做的标记之间,在某些情况下也不尽如意,楼主不妨试试以下方法:
    <style type='text/css'>
    @media print {
     input, textarea, select, a, .NoPrint { display: none; }
    }
    </style>
    以上样式设置所有输入控件,选择控件,超链接和指定类型的元素在打印时不显示,即是不打印,要想不打印的元素都只加上样式类“NoPrint”即可,如:
    <body>
    <div>在这里放入任意需要打印的内容<span class='NoPrint'>此内容不打印!</span><span style='color:red; font-size:20px;'>这是大号字!</span></div>
    <div class='NoPrint'>说明:此信息不会被打印。</div>
    </body>

     

    在打印时调用这个方法就可以了!~

    //处理打印部分页面信息的方法
    function doPrint() {
    bdhtml=window.document.body.innerHTML; //获得body标签内的全部html代码
    sprnstr="<!--startprint-->"; //声明一个字符串,用于表示打印的起始位置
    eprnstr="<!--endprint-->"; //标示打印的结束位置
    prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17); //查找打印的起始字符串并加上17,因为<!--startprint-->的长度为17,所以要加17,这样打印时不会把标示打印出来
    prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr)); //和上边的意思差不多
    window.document.body.innerHTML=prnhtml; //通过window对象得到body对象并将当前窗体的内容设置为要打印起始标示符和结束标示符之间的内容,这样打印出来就只有需要的部分,而其他没用的信息都不会有的
    window.print();
    }

    有两点需要说明一下:程序中声明了一个打印起始的字符串和一个结束的字符串,根据获取这两个字符串
    来得到需要打印的内容,所以在你的html代码中应该有这两个字符串的出现,至于位置就像这样:比如我
    要打印当前页面中一个<table></table>中所有的信息,那么你应该在这个<table>标签前加入起始字符串
    在</table>结束标签后加入结束标示的字符串。就像这样<!--startprint--><table></table><!--endprint-->
    此处需要注意一个地方:<!--startprint-->这个和<table>标签之间不要有空格回车这样的空字符
    否则程序运行会有问题。


     

    展开全文
  • 、通过【设置打印区域】来实现 1、选中要打印的区域; 2、首先点击【页面布局】功能,然后点击[打印区域],在弹出的两个选项里选中[设置打印区域s]。 未被设置到打印区域里的表格就是“显示但是打印时不打印...
  • 实际上,是浏览器打印功能菜单的种程序调用,设置打印参数,比如纸型,页边距,选择打印机等等。需要指出的是这种方法提供打印前和打印后的事件onbeforeprint、onafterprint。可以在打印前的时候重新编辑一些...
  • C语言打印字符串的一部分的方法

    千次阅读 2017-02-05 11:30:07
    C语言打印字符串的一部分的方法 头文件:#include sprintf()函数用于将格式化的数据写入字符串,其原型为:  int sprintf(char *str, char * format [, argument, ...]); 【参数】str为
  • 如何在页面上调用打印机!...要打印内容:JSP上的个&lt;DIV&gt;&lt;/DIV&gt;,打印按钮:打印按钮的方法:$(function(){   $('#checkin_div').click(function(){ $('#dvData')....
  • printf 打印字符串的任意一部分

    千次阅读 2014-10-24 09:32:16
    使用printf()函数打印字符串的任意部分,请看下例: #include  #include  #include    int main()  {   char * source_str = "THIS IS THE SOURCE STRING" ;     /* Use ...
  • 如下方法: function printProof(){ var printData = document.getElementById... // 只打印 forPrint 这个div中的内容。 window.document.body.innerHTML = printData; //把 html 里的数据 复制给 body 的 html 数
  • ajax请求成功之后,自动打开个空白页面,并打印出了返回内容,返回值是规定的success内容:{code: "200", msg: "请求成功"}。 1、不走success方法,只走error方法 2、自动打开个空白页面,...
  • windwow.print()用于打印当前窗口的内容,很简便,可当内容特殊并且打印有特殊需求的时候就要绕个圈了。下面是需要打印的表格:  当数据量少的时候像上面的表格一样,中间的内容只有5条数据,打印出来在纸上会有...
  • 2) 与原生态的print() 区别在于,取消打印页面后可以完整保留当前访问页面的内容。 2、代码部分 1) JS 函数: function do_print(id_str)//id-str 打印区域的id { var el = document.getElementById(id_str); ....
  • window.print()打印网页局部内容

    千次阅读 2014-07-18 09:46:22
    用window.print()打印指定div里面的内容 今天客户让添加个打印证照功能,直接用window.print()打印的是整个页面,而用以下方法就可以只打印证明了   window.print可以打印网页,但有时候我们只希望打印...
  • 173710268 E见钟情1 编辑完成后,自动换行,打印预览显示不全,底部被边框遮住,效果图...实际文件中内容复杂,行数不定 没有办法手动拖拽行高,实际内容由jxl导出的。excel03,07,13均已测试,效果相似。 求大神解决
  • 运用js调用打印机,打印多联单 、打印机部分打印
  • 打印numpy数组全部内容

    万次阅读 2016-11-14 21:19:55
    如果个数组用来打印太大了,NumPy自动省略中间部分而只打印角落 >>> print arange(10000) [ 0 1 2 ..., 9997 9998 9999] >>> >>> print arange(10000).reshape(100,100) [[ 0 1 2 ..., 97 98 99] [ 100 101 102 ...
  • (注明:“添加文本我要打印”是个label标签的内容) ![只打印框框内部的“添加文本我要”几个字,而不用打印打印”两个字](https://img-ask.csdn.net/upload/201508/24/1440416988_356870.png)
  • 实现:   .noprint{display : none...打印部分 实现二:WebBrowser控件 classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2">  实现三:windows自带的打印对象 onClick="window.print()"/> 实现四:jQ
  • 使用js打印网页局部图片(内容

    万次阅读 2018-07-30 21:20:36
    //定义打印区域起始字符,根据这个截取网页局部内容 sprnstr= "<!--startprint-->" ; //打印区域开始的标记 eprnstr= "<!--endprint-->" ; //打印区域结束的标记 prnhtml=bdhtml.substr(bdhtml.indexOf...
  • PHP 打印输出数组内容及结构

    千次阅读 2012-06-20 14:54:59
    print_r() 和 var_dump() 函数可以打印输出整个数组内容及结构。 print_r() 利用 print_r() 函数可以打印输出整个数组内容及结构,按照一定格式显示键和元素。注意 print_r() 函数不仅是只用于打印,实际它是用于...
  • c-lodop打印网页内容

    千次阅读 2017-03-11 13:36:19
    最近在做个发票打印的功能,由于业务需要,所以要用html设计好打印样式,然后通过打印html页面的形式去打印内容。 首先。。。。。你得有个设计好的样式页面,然后把数据注入到你的页面中。 好,然后打开页面查看...
  • 、问题:需要打印Excel表中的内容,但在“普通视图”中将格式调好后,点击“打印预览”看,嘿,一些单元格中的内容又不对了。而最终打印出的内容又是与“打印预览”一致的,“打印预览”有问题,
  • js调用打印机打印指定内容

    千次阅读 2015-07-17 09:44:47
    js调用打印机打印指定内容分两种方式,种是用html5把指定区域转化为canvas在打印,但是此种方法当内容中有图片时却打印不了,代码如下: function printById(id) {  html2canvas(document.getElementById(id), {...
  • 目前在接到需求需要开发打印功能,打印功能使用jasper report技术设计打印模板,在时间的过程中由于detail中的内容溢出,每当溢出的内容在最后行的时候就会在下页显示剩余内容,没有溢出的内容则显示重复。...
  • js实现IE、谷歌浏览器打印网页内容

    千次阅读 2018-03-30 17:02:14
    分享种通用的打印网页、文本内容的方法.经测试,此方法兼容IE8~IE11及chrome浏览器。 window.print() 此方法会弹出打印对话框,打印的是window.document.body.innerHTML中的内容 。 html: &lt;!DOCTYPE ...
  • 有时候会遇到打印CAD图纸不完整的问题,总是有一部分不显示,打印不出来。小编就有过类似的情况,我先是重新添加了新的虚拟打印机,重新进行了新的打印,结果发现不是这一问题。进过一系列的排查后才发现,原来问题...
  • 打印java web页面内容代码大全

    千次阅读 2014-07-22 10:50:02
    s打印java web页面内容代码大全  (2011-08-02 10:05:27) 转载▼ ...第种方法:指定不打印区域 ...使用CSS,定义个.noprint的class,将不打印内容放入这个class内。 详细如下:   .noprint{visibili
  • ![图片说明](https://img-ask.csdn.net/upload/201508/28/1440747345_538504.png) 打印出来为: ![图片说明]... frame标签下的内容都没有被打印下来 求指点

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 491,541
精华内容 196,616
关键字:

怎么打印一部分内容