如何使用jQuery打印文档中的表内容

How to Print Table Content in Document Using jQuery?

本文关键字：文档何使用 jQuery 打印更新时间：2023-09-26

如何使用jQuery只打印文档的表？

    <!--panel-->
<div class="panel panel-primary">
    <!-- Default panel contents -->
    <div class="panel-heading">New Order
    <button class="btn btn-sm pull-right btn-default" type="submit">Print Item</button>
    </div>
    <div class="panel-body">
        <!--table-->
        <table class="table table-condensed">
            <thead>
                <tr>
                    <th>#</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Username</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>Mark</td>
                    <td>Otto</td>
                    <td>@mdo</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>Jacob</td>
                    <td>Thornton</td>
                    <td>@fat</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td colspan="2">Larry the Bird</td>
                    <td>@twitter</td>
                </tr>
            </tbody>
        </table>
        <!--end of table-->
    </div>
</div>
<!--end of panel-->

演示

您可以试试这个函数。将您的表放在具有唯一ID的div中，然后在JQuery:中引用它

<script>function printDiv() {
                    var divName= "<DIV ID HERE>";
                     var printContents = document.getElementById(divName).innerHTML;
                     var originalContents = document.body.innerHTML;
                     document.body.innerHTML = printContents;
                     window.print();
                     document.body.innerHTML = originalContents;
                }</script>

试试这个（演示）：

$(function () {
    $('button[type="submit"]').click(function () {
        var pageTitle = 'Page Title',
            stylesheet = '//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css',
            win = window.open('', 'Print', 'width=500,height=300');
        win.document.write('<html><head><title>' + pageTitle + '</title>' +
            '<link rel="stylesheet" href="' + stylesheet + '">' +
            '</head><body>' + $('.table')[0].outerHTML + '</body></html>');
        win.document.close();
        win.print();
        win.close();
        return false;
    });
});