0

我有一个非常简单的 HTML 页面,它只有一个垂直表格,可以将数据动态生成到其中。我遇到的问题是,当我想打印我的页面时,它会在我的一个页面中途切断<tr>,如下所示:

在此处输入图像描述

有没有办法使用CSS,所以我可以以某种方式<tr>在页面底部结束a,然后<tr>在第二页开始下一个?

我在网上搜索了解决方案,但一无所获。对于我所追求的,要清楚地搜索它并不容易。

希望有人可以帮助解决这个问题。

4

2 回答 2

1

使用类似的东西

tr {
    page-break-inside: avoid;
}
于 2013-11-06T15:37:37.007 回答
0

这是一个更可靠的 JQuery 解决方案:

$(document).ready(function () {
    $('table.splitForPrint').each(function(i, tabela){
        var per_page = 13;

        var pages = Math.ceil($('tbody tr').length / per_page);

        if (pages == 1)
            return;

        var ultimo = $(tabela);
        for(var p = 1; p <= pages; p++) {
            var copy = ultimo.clone();

            $('tbody tr', ultimo).each(function(i, tr){
                if (i >= per_page) {
                    $(tr).remove();
                }
            });

            $('tbody tr', copy).each(function(i, tr){
                if (i < per_page) {
                    $(tr).remove();
                }
            });

            if (p < pages)
                copy.insertAfter(ultimo);

            copy.css('page-break-before', 'always');

            ultimo = copy;
        }
    });
});

https://code.google.com/p/wkhtmltopdf/issues/detail?id=168#c4

于 2013-11-06T16:37:28.817 回答