開源的javascript實現頁面打印功能，兼容全部的瀏覽器（狀況屬實）

時間 2019-11-19

標籤開源 javascript 實現頁面打印功能兼容全部瀏覽器狀況屬實欄目 JavaScript 简体版

原文原文鏈接

這篇文章徹底是屬於技術文章，也是記錄一下本身在項目當中遇到的坑爹問題啊，由於是B/S的程序，因此打印功能仍是必需要有的，對於打印我選擇了一個js插件，發現很是的簡單和方便，因此這裏拿出來和你們分享一下啊！仍是頗有用的哦！javascript

在實際項目當中有時候還要包括數據統計的功能，這個我相信通常的項目都要有的吧（想聽聽你們的意見），這裏也想請你們幫我推薦一個好的javascript插件吧，或者其餘什麼組件，不廢話了，看代碼去。css

VS環境：2012html

測試瀏覽器：全部主流瀏覽器（Chorme，Firefox，IE10，9，8，7，Opera，360安全（急速和兼容模式））html5

這是個人我的博客地址，你們能夠看看哦！在留言板留言啊！http://yanghenglian.com/（使用高版本的瀏覽器打開哦，使用了html5和css3的一些東西，因此效果好，最好推薦谷歌）！java

1.頁面（代碼）

打印頁面jquery

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>javascript實現頁面打印（適合B/S）程序</title>
    <script src="js/jquery-1.6.4.min.js"></script>
    <script src="js/jquery.printPage.js"></script>
    <script type="text/javascript">
        $(document).ready(function ()
        {
            $(".btnPrint").printPage();
        });
    </script>
</head>
<body>
    <!-- class自定義的類樣式 -->
    <p><a class="btnPrint" href="list.html">打印</a></p>
</body>
</html>

index.html

列表頁面css3

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>列表頁面</title>
</head>
<body>
    <table>
        <tbody>
            <tr>
                <td width="340" valign="top">1</td>
                <td width="340" valign="top">2</td>
                <td width="340" valign="top">3</td>
                <td width="340" valign="top">4</td>
                <td width="340" valign="top">5</td>
            </tr>
            <tr>
                <td width="340" valign="top">上</td>
                <td width="340" valign="top">山</td>
                <td width="340" valign="top">打</td>
                <td width="340" valign="top">老</td>
                <td width="340" valign="top">虎</td>
            </tr>
        </tbody>
    </table>
</body>
</html>