Question

我试图仅在打印预览的页脚部分将页脚粘贴到最后一页的底部

页面内容是动态的，所以我不知道哪个是我的最后一页。

我已经尝试了下面的代码，它使页脚出现在预览的最后一页但不在最后一页的页脚部分。当前页脚部分打印在第2页，紧邻主体部分但是我希望在页脚部分的第2页打印页脚部分

<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.min.js"> </script>
    <script language="javascript" type="text/javascript">
        function printDiv(divID) {
            //Get the HTML of div
            var divElements = document.getElementById(divID).innerHTML;
            //Get the HTML of whole page
            var oldPage = document.body.innerHTML;

            //Reset the page's HTML with div's HTML only
            document.body.innerHTML =
              "<html><head><title></title></head><body>" +
              divElements + "</body>";

            //Print Page
            window.print();

            //Restore orignal HTML
            document.body.innerHTML = oldPage;


        }
    </script>

</head>
<body>
    <button onclick="myFunction()"> Print this page</button> <input type="button" value="Print 1st Div" onclick="javascript:printDiv('printablediv')" /> >
    <script>
        function myFunction() {
            window.print();
        }

    </script>
    <div id="printablediv">
        <table>
            <thead>
                <tr style="height:30px;"> <th> PAGE HEADER</th> </tr>
            <thead>
            <tfoot> <tr> <td id="spacer" style="height:200px;"> </td> </tr> </tfoot>
            <tbody>
                <tr>
                    <td>
                        content<br> content<br> content<br> content<br> content<br> content<br>
                        content<br> content<br> content<br> content<br> content<br> content<br>
                        content<br> content<br> content<br> content<br> content<br> content<br>
                        content<br> content<br> content<br> content<br> content<br> content<br>
                        content<br> content<br> content<br> content<br> content<br> content<br>
                        content<br> content<br> content<br> content<br> content<br> content<br>
                        content<br> content<br> content<br> content<br> content<br> content<br>
                        content<br> content<br> content<br> content<br> content<br> content<br>

                    </td>
                </tr>
            </tbody>
        </table>        

        <div id="footer" style="position:relative; bottom: 0;"> Sample </div>

    </div>
</body>
</html>

请参阅我附带的屏幕截图，以获取参考

仅在页脚部分打印最后一页底部的页脚

0 个答案: