使用javascript实现打印功能-优快云博客

本文链接：https://blog.youkuaiyun.com/iteye_6751/article/details/81925413
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
        <title>js打印范例</title>
        <style type="text/css">
            body {
                font-size: 12px;
                color: #333;
            }
            
            #content {
                border: solid 1px #333;
                background: #ffc;
            }
        </style>
        <script type="text/javascript">
            function startPrint(obj){
                var oWin = window.open("", "_blank");
                var strPrint = "<h4 style='font-size:18px; text-align:center;'>打印预览区</h4>\n";
                strPrint = strPrint + "<script type=\"text/javascript\">\n";
                strPrint = strPrint + "function printWin()\n";
                strPrint = strPrint + "{";
                strPrint = strPrint + "var oWin=window.open(\"\",\"_blank\");\n";
                strPrint = strPrint + "oWin.document.write(document.getElementById(\"content\").innerHTML);\n";
                strPrint = strPrint + "oWin.focus();\n";
                strPrint = strPrint + "oWin.document.close();\n";
                strPrint = strPrint + "oWin.print()\n";
                strPrint = strPrint + "oWin.close()\n";
                strPrint = strPrint + "}\n";
                strPrint = strPrint + "<\/script>\n";
                strPrint = strPrint + "<hr size='1' />\n";
                strPrint = strPrint + "<div id=\"content\">\n";
                strPrint = strPrint + obj.innerHTML + "\n";
                strPrint = strPrint + "</div>\n";
                strPrint = strPrint + "<hr size='1' />\n";
                strPrint = strPrint + "<div style='text-align:center'><button οnclick='printWin()' style='padding-left:4px;padding-right:4px;'>打  印</button><button οnclick='window.opener=null;window.close();' style='padding-left:4px;padding-right:4px;'>关  闭</button></div>\n";
                oWin.document.write(strPrint);
                oWin.focus();
                oWin.document.close();
            }
        </script>
    </head>
    <body>
        <button id="btnPrint" οnclick="startPrint(document.getElementById('content'))">
            打印内容
        </button>
        <div id="content">
            <div style="font-size:12px;color:#333;">
                这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容
            </div>
        </div>
    </body>
</html>