js实现web打印预览的二个代码

发布时间:2020-01-15编辑:脚本学堂
为大家提供由javascript编写的web打印预览的二个代码,大家看看有何区别,是否能满足自己的需要。

例1,

<html>
<head>
    <title>打-印-预-览-www.jb200.com</title>    
    <script language="javascript" type="text/javascript">
    <!--
        //弹窗打印函数
        function printPage(id) {
            var needHTML = document.getElementById(id).innerHTML;
            //alert(needHTML);
            var OpenWindow = window.open("print.htm", "abc", "height=100, width=150, top=0, left=0,toolbar=no,menubar=no, scrollbars=no, resizable=no, location=no, status=no");
            OpenWindow.document.write("<html>");
            OpenWindow.document.write("<head>");
            OpenWindow.document.write("<title>打印</title>");
            OpenWindow.document.write("</head>");
            OpenWindow.document.write("<body>");
            OpenWindow.document.write(needHTML);
            OpenWindow.document.write("</body>");
            OpenWindow.document.write("</html>");
            OpenWindow.document.close();
            OpenWindow.document.location.reload();
            OpenWindow.print();
        } 
    -->
    </script>
</head>
<body>
    <div id="aidd2008">
        <div id="div0">
            不打印的内容
        </div>
        <div id="div1">
            <input type="button" value="打印" onclick="printPage('needPrint')" />
        </div>
        <div id="needPrint">
            需要打印的内容</div>
    </div>
</body>
</html>

例2,

<html>
<head>
    <title>打-印-预-览-www.jb200.com</title>
    <script type="text/javascript" language="javascript">
        var hkey_root, hkey_path, hkey_key
        hkey_root = "HKEY_CURRENT_USER"
        hkey_path = "softwareMicrosoftInternet ExplorerPageSetup"
        //设置网页打印的页眉页脚边距为空 
        function pagesetup_null() {
            try {
                var RegWsh = new ActiveXObject("WScript.shell");
                hkey_key = "header";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "");
                hkey_key = "footer";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "");
                hkey_key = "margin_left";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0.0");
                hkey_key = "margin_right";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0.0");
                hkey_key = "margin_top";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0.0");
                hkey_key = "margin_bottom";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0.0");
            } catch (e) { }
        }
        //设置网页打印的页眉页脚边距为默认值 
        function pagesetup_default() {
            try {
                var RegWsh = new ActiveXObject("WScript.Shell");
                hkey_key = "header";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "&w&b页码,&p/&P");
                hkey_key = "footer";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "&u&b&d");
                hkey_key = "margin_left";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0.750000");
                hkey_key = "margin_right";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0.750000");
                hkey_key = "margin_top";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0.750000");
                hkey_key = "margin_bottom";
                RegWsh.RegWrite(hkey_root + hkey_path + hkey_key, "0.750000");
            } catch (e) { }
        }
        function setdivhidden(id) {//把指定id以外的层统统隐藏 
            var divs = document.getElementsByTagName("DIV");
            for (var i = 0; i < divs.length; i++) {
                if (divs.item(i).id != id)
                    divs.item(i).style.display = "none";
            }
        }
        function setdivvisible(id) {//把指定id以外的层统统显示 
            var divs = document.getElementsByTagName("DIV");
            for (var i = 0; i < divs.length; i++) {
                if (divs.item(i).id != id)
                    divs.item(i).style.display = "block";
            }
        }
        function printpr() //预览函数 
        {
            pagesetup_null(); //预览之前去掉页眉页脚边距
            setdivhidden("div1"); //打印之前先隐藏不想打印输出的元素
            var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
            document.body.insertAdjacentHTML('beforeEnd', WebBrowser); //在body标签内加入html(WebBrowser activeX控件) 
            WebBrowser1.ExecWB(7, 1); //打印预览 
            WebBrowser1.outerHTML = ""; //从代码中清除插入的html代码 
            pagesetup_default(); //预览结束后页眉页脚恢复默认值 
            setdivvisible("div1"); //预览结束后显示按钮 
        }
        function print() //打印函数 
        {
            pagesetup_null(); //打印之前去掉页眉,页脚 
            setdivhidden("div1"); //打印之前先隐藏不想打印输出的元素 
            var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
            document.body.insertAdjacentHTML('beforeEnd', WebBrowser); //在body标签内加入html(WebBrowser activeX控件) 
            WebBrowser1.ExecWB(6, 1); //打印 
            WebBrowser1.outerHTML = ""; //从代码中清除插入的html代码 
            pagesetup_default(); //打印结束后页眉页脚恢复默认值 
            setdivvisible("div1"); //打印结束后显示按钮 
        } 
    </script>
</head>
<body>
    <form id="form1">
    <div id="div0">
        <input id="btnClose" type="button" onclick="Javascript:window.opener=null;window.close()"
            value="关闭" />
        <input type="button" value="打印预览" onclick="printpr()">
        <input type="button" onclick="print()" value="打印">
    </div>
    <div id="div1">
        文字。。。
        <img alt="" src='<%=this.rooDir+this.Request.QueryString["URL"] %>' /></div>
    </form>
</body>
</html>

之前,我们介绍过一篇有关打印的文章,大家可以参考下:javascript 打印、设置、预览的实现代码

下面来看以上代码的缺点:
有安全性提示,需要手动允许运行或者修改浏览器安全性设置。
页眉页脚边距有时候不灵光,需要多试几次(我测试时是这样,可能是电脑的问题)。

页眉页脚边距的默认值可以通过在注册表里删除一个项footer,关闭注册表,随便新打开一个浏览器页面,打印预览,再打开注册表来查看各个项的默认值。
比如删除HKEY_CURRENT_USERsoftwareMicrosoftInternet ExplorerPageSetup下面的footer项。

有了以上的二个代码,就可以轻松实现web页面打印预览与打印了,希望可以帮助到大家。

您可能感兴趣的文章:
JavaScript打印iframe内容的方法
js打印iframe中div内容的方法
javascript实现Web Browser 打印预览的代码
Javascript实现IE打印页面设置、预览、首页设置的代码
js使用WebBrowser实现打印功能的代码
javascript 打印、设置、预览的实现代码