zoukankan      html  css  js  c++  java
  • 网页打印javascript:window.print()

    网页打印javascript:window.print()

    可以用css控制,看孟老大写的。
    @media print
    .a {display:block}
    .b {display:hidden}
    好像是这样。把你不想打印的部分class设为b

    首先在网页中添加:

          <OBJECT id="WebBrowser" height="0" width="0" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"
           VIEWASTEXT>
          </OBJECT>

    然后就可以依次加入功能按钮了:

    <input onclick="document.all.WebBrowser.ExecWB(6,1)" type="button" value="打印"> <input onclick="document.all.WebBrowser.ExecWB(6,6)" type="button" value="直接打印">
          <input onclick="document.all.WebBrowser.ExecWB(8,1)" type="button" value="页面设置">
          <input onclick="document.all.WebBrowser.ExecWB(7,1)" type="button" value="打印预览">&nbsp;<INPUT type="button" value="关闭窗口" onclick="javascript:window.close()">

    将这两块东西放到<center class=noprint></center>就不会打印这些按钮了。当然要定义noprint了:

    <style media="print">.Noprint { DISPLAY: none }</style>只要把不想打印的东西的css设置成noprint就可以了。

    现在就实现了基本的web打印,需要注意的情况如下:

    必须将ie的internet选项的安全设置中对于没有标记为安全的ActiveX控件进行...设置成提示或者启用,否则会报错,导致不可用。
    如果在vs.net编辑环境下编辑该页面,它经常自动的给object添加多余的参数,有了这些东西,打印就会出错,所以要记得最后保存的时候删除它们。
    为了简便并且达到最好的效果,我们可以在一个页面实现编辑和打印,这时候会需要很多的textbox,我们把它的css设置成.edittext
    {
    overflow-y:visible;
    100%;
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
    }就可以实现在打印的时候不显示边框和multiline的textbox不显示滚动条了。

    还有一些小经验就是在设置标格宽度的时候,对于A4纸张,横打用920,竖打用640,效果最好。

    相信用B/S方式做过应用的人都可能会遇到这样一个问题,如何方便、美观地实现报表打印。如果使用浏览器的打印菜单打印的话,将把网页上的一些无用的东西打到报表上,比如应用菜单等。因为选择打印菜单打印网页将会把网页中的所有内容全部打印出来,如果你的应用有分帧则打印内容将包括各帧中的内容,而你实际要的内容只是其中一部分。所以有很多应用就只能把打印功能放到后台完成了。   针对这种情况,我们该怎么办?其实可以有多种方法实现网页打印功能。

      一种方法就是使用专业的打印工具,如Crystal Reports(水晶报表)。用过Visual Studio 5.0的朋友肯定记得这个工具,不过那时的版本只有4.几。现在的最新版本已达9了,近几个版本的水晶报表都支持WEB打印。最简单的方法是先用水晶报表制作好模板,然后使用ASP带参数调用制作好的模板即可。水晶报表在网页上生成报表后,可以直接打印,也可以转存为其它的比较通过的文件如Excel文件。使用水晶报表可以制作出非常漂亮的样式,关键在你对水晶报表的开发能力上,但由于水晶报表价格较高,只有当项目很赚钱时才买得起。

      第二种方法是购买第三方的网上打印控件,费用同水晶报表相比便宜,但效果性能到底如何则仁者见仁了。


      第三种方法是利用样式表及JavaScript自定义函数实现。通过样式表及JavaScript,实现网页打印,效果也还可以。在此有一个实例请大家看看。下面是打印函数实现详解:
    <script language="JavaScript" type="text/JavaScript">
    <!--
    function DP() {
    if (window.print)
    {
    var Div1 = document.all.Div1.innerHTML;
    var Div2 = document.all.Div2.innerHTML;
    // *****************************************************
    // Div1、Div2即为你在打印的区域
    // 这里根据你要打印的哪些内容,从原显示页面中用
    // <div id=Div1>Div1....</div><div id=Div2>Div2...</div>
    // 等标示出来,要打印多少项目就标示多少
    // ***************************************************** var css = '<style type="text/css" media=all>' +
    'p { line-height: 120%}' +
    '.ftitle { line-height: 120%; font-size: 18px; color: #000000}' +
    'td { font-size: 10px; color: #000000}' +
    '</style>' ;
    // *****************************************************
    // 定义打印用的CSS,具体你想打印出什么样的格式全看你自己
    // 了,但要注意:如果此处有什么同网页中不一致的,可能打印
    // 出来的页面同网页格式、字体可能会有所不同
    // *****************************************************

    var body ='<table width="640" border="0" cellspacing="0" cellpadding="5">' +
    ' <tr> ' +
    ' <td class="fbody"> ' +
    ' <div align="center" class=ftitle>' + Div1 + '</div>' + Div2 +
    ' </td>' +
    ' </tr>' +
    '</table>';
    // ******************************************************
    // 在此处重新设置的打印格式,根据你的打印要求,将原显示的
    // 网页的DIV内容重新组合,可以根据你原来的表格内容,去掉
    // 不要打印的,你也可以能下面定义的noprint忽略掉你不想打
    // 印的东西,只调用你要打印的内容,但这样被忽略掉的地方将
    // 打印出空,不是很美观。表格宽度要同打印的纸张宽度匹配。
    // ******************************************************

    document.body.innerHTML = '<center>' + css + body + '</center>';
    // ******************************************************
    // 重设document.body,打印文档准备就绪
    // ******************************************************

    window.print();
    window.history.go(0);
    // ******************************************************
    // 调用打印命令,打印当前窗口内容。当你打印时其实是一张新
    // 的网页了,但网页文件还是原先的。紧接着调用
    // window.history.go(0),再回到打印前的页面,效果相当不差
    // ******************************************************
    }
    }
    -->
    </script>

    <style>
    @media print {
    .noprint {display:none}
    }
    </style>
    <!--//.noprint 定义了noprint,在以下不需要打印的地方加入 class="noprint"后,用window.print()打印就会忽略-->
      好了,一切就绪了,现在要做的就是调用DP函数,如果你将实现调用的按钮设计在同一张网页上,则直接调用即可;如果你用了分帧方法,实现调用的按钮是在另一张网页上,则在DP函数的第一行加入window.focus()命令,否则打印的只是有按钮的网页。

      第四种方法,实现是一种取巧的方法。一样还是通过调用window.print()实现,只是将你要打印的内容专门生成一张网页,而打印按钮在另一帧上。假设报表网页在mainFrame上,按钮在topFrame上,按钮调用PrintReports()函数,PrintReports()函数如下即可实现打印工作。
    function PrintReports() //topFrame网页中的函数
    {
    try
    // *******************************************************
    // 错误处理,如果在mainFrame中的网页没有DP函数则不打印
    // *******************************************************
    {
    window.parent.frames("mainFrame").DP();
    }
    catch(e)
    {
    alert("no object to print!");
    }
    }
    function DP() // mainFrame网页中函数
    {
    window.focus();
    if (window.print)
    {
    window.print();
    }
    }

  • 相关阅读:
    selenium之css定位
    selenium之Xpath定位
    配置JAVA_HOME踩得坑 。。
    linux 怎么查看系统的环境变量 与设置jdk 系统环境变量
    jenkins添加环境变量 ,win 10的 环境变量如下,win7 就是不加也可以运行,不报 “python 不是内部命令 ” 的错误。
    win7 bat copy 一个文件 到另外的文件夹内,路径得用引号哦
    路由器原理
    mven入门
    局域网内和局域网间的通信
    详解DNS域名解析全过程
  • 原文地址:https://www.cnblogs.com/zengwei/p/2234467.html
Copyright © 2011-2022 走看看