时间戳

首页 > 解决方案 > 如何在不同页面中打印所有表格的内容？

javascript - 如何在不同页面中打印所有表格的内容？

问题描述

我想打印一个表格的所有内容，但只显示第一页的内容，如果表格占据超过一页，则不打印所有内容。

如何在不丢失页面绑定的情况下打印所有内容？

选项1：

$(document).ready(function() {
  $('.nonPrintable').hide();
  window.print();
  $('.nonPrintable').show();
});

选项 2（使用 printJS 库）：

printJS({
    printable: 'table',
    type: 'html',
    targetStyles: ['*'],
    maxWidth: 1500
});

选项 3（这将打印所有没有 CSS 的内容）：

var divElement = document.getElementById('table').innerHTML;
var printWindow = window.open("", "_blank", "");
printWindow.document.open();
printWindow.document.write('<html><body>');
printWindow.document.write(divElement);
printWindow.document.write('</body></html>');
printWindow.document.close();
printWindow.focus();
printWindow.print();

标签： javascriptgoogle-app-maker

解决方案

问题真的很模糊，但是我从您的屏幕截图中假设您希望选择使用样式表打印出表格内容。

您可以为此使用document.writeand并添加链接到您的样式表的变量。print()可能会进行调整，因为我不知道你的DOM样子。

JS

$(function () {
    $('#print').click(function () {
        var pageTitle = 'Title of sheet here',
            stylesheet = 'path/to/style.css',
            win = window.open('', 'Print', 'width=990,height=590');
        win.document.write('<html><head><title>' + pageTitle + '</title>' +
            '<link rel="stylesheet" href="' + stylesheet + '">' +
            '</head><body>' + $('.tableClass')[0].outerHTML + '</body></html>');
        win.document.close();
        win.print();
        win.close();
        return false;
    });
});

然后只需按一下按钮即可打印内容。

HTML

<button type="button" id="print">Print here!</button>

这也将保留页面绑定。

推荐阅读