Css 在长表中的两行之间应用分页符

我正在使用引导在我的页面中显示表格。我正在使用jQuery打印插件打印它，但是分页符工作不正常。文本在两页之间被截断。这是图像：

我的HTML表格示例

<div id="showGrid" class="table-responsive" style="max-height: 175px;">
        <table class="table table-striped table-bordered table-hover table-condensed tablecollapse in" style="margin-bottom: 0px;" id="table">
            <thead>
                <tr>
                    <th> DATE </th>
                    <th> FORM NAME </th>
                    <th> OP NO </th>
                    <th> PATIENT NAME </th>
                    <th> AMOUNT </th>
                    <th> PAYMENT MODE </th>
                    <th> PAY TYPE </th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td class="text-uppercase"> 2015-10-26 <a class="btn btn-box-tool btn-sm prints hidden" data-toggle="tooltip" title="" data-original-title="Print"><i class="fa fa-print"></i></a></td>
                    <td class="text-uppercase"> Patient Registration </td>
                    <td class="text-uppercase"> AN1026-1 </td>
                    <td class="text-uppercase"> FFFFF  </td>
                    <td class="text-uppercase"> 300.0 </td>
                    <td class="text-uppercase"> CASH </td>
                    <td class="text-uppercase"> CASH </td>
                </tr>
                <tr>
                    <td class="text-uppercase"> 2015-10-26 <a class="btn btn-box-tool btn-sm prints hidden" data-toggle="tooltip" title="" data-original-title="Print"><i class="fa fa-print"></i></a></td>
                    <td class="text-uppercase"> Patient Registration </td>
                    <td class="text-uppercase"> AN1026-2 </td>
                    <td class="text-uppercase"> VVVVV  </td>
                    <td class="text-uppercase"> 300.0 </td>
                    <td class="text-uppercase"> CASH </td>
                    <td class="text-uppercase"> CASH </td>
                </tr>
            </tbody>
        </table>
    </div>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool btn-sm" name="btnPrint" id="btnPrint" data-toggle="tooltip" title="" data-original-title="Print" onclick="printAll();"><i class="fa fa-print"></i></button>
</div> 

js用于打印，我从

（函数（$）{
“严格使用”；
函数getjQueryObject（字符串）{
var jqObj=$（“”）；
试一试{
jqObj=$（字符串）
.clone（）；
}捕获（e）{
jqObj=$（“”）
.html（字符串）；
}
返回jqObj；
}
函数printFrame（框架窗口，超时）{
var def=$.Deferred（）；
试一试{
setTimeout（函数（）{
frameWindow.focus（）；
试一试{
如果（！frameWindow.document.execCommand（'print'，false，null））{
frameWindow.print（）；
}
}捕获（e）{
frameWindow.print（）；
}
frameWindow.close（）；
def.resolve（）；
}，超时）；
}捕捉（错误）{
定义拒绝（错误）；
}
返回def；
}
函数printContentInNewWindow（内容，超时）{
var w=window.open（）；
w、 文件。编写（内容）；
w、 document.close（）；
返回打印框（w，超时）；
}
函数isNode（o）{
return！！（typeof Node==“object”？o节点实例：o&&typeof o==“object”&&typeof o.nodeType==“number”&&typeof o.nodeName==“string”）；
}
$.print=$.fn.print=函数（）{
var期权，$this，self=this；
if（自我实例为$）{
self=self.get（0）；
}
if（isNode（self））{
$this=$（self）；
如果（arguments.length>0）{
选项=参数[0]；
}
}否则{
如果（arguments.length>0）{
$this=$（参数[0]）；
if（isNode（$this[0]））{
如果（arguments.length>1）{
选项=参数[1]；
}
}否则{
选项=参数[0]；
$this=$（“html”）；
}
}否则{
$this=$（“html”）；
}
}
var默认值={
环球时尚：没错，
mediaPrint：没错，
样式表：“plugins/print/print.css”，
noPrintSelector:“.无打印”，
伊夫拉姆：是的，
追加：null，
prepend:null，
ManuallycopyForM值：真，
递延：$.deferred（），
超时：250
};
options=$.extend（{}，默认值，（options{}）；
var$styles=$（“”）；
if（选项.全局样式）{
$styles=$（“样式、链接、元、标题”）；
}else if（options.mediaPrint）{
$styles=$（“链接[媒体=打印]”）；
}
if（options.stylesheet）{
$styles=$.merge（$styles，$（''）；
}
var copy=$this.clone（）；
复制=$（“”）
.附加（副本）；
copy.find（options.noPrintSelector）
.remove（）；
copy.append（$styles.clone（））；
append（getjQueryObject（options.append））；
copy.prepend（getjQueryObject（options.prepend））；
if（选项。手册LycopyForM值）{
copy.find（“输入”）
.each（函数（{
var$字段=$（此字段）；
if（$field.is（“[type='radio']”）| |$field.is（“[type='checkbox']”）{
如果（$field.prop（“选中”））{
$field.attr（“选中”、“选中”）；
}
}否则{
$field.attr（“value”，$field.val（））；
}
});
copy.find（“select”）.each（函数（）{
var$字段=$（此字段）；
$field.find（“：selected”）.attr（“selected”、“selected”）；
});
copy.find（“textarea”）.each（函数（）{
var$字段=$（此字段）；
$field.text（$field.val（））；
});
}
var content=copy.html（）；
试一试{
options.deferred.notify（'generated_markup'，content，copy）；
}捕捉（错误）{
console.warn（'通知延迟的错误'，err）；
}
copy.remove（）；
if（options.iframe）{
试一试{
变量$iframe=$（options.iframe+“”）；
变量iframecont=$iframe.length；
如果（iframeCount==0）{
$iframe=$（''）
.prependTo（“正文”）
.css({
“位置”：“绝对”，
“顶部”：-999，
“左”：-999
});
}
var w，wdoc；
w=$iframe.get（0）；
w=w.contentWindow | | w.contentDocument | | w；
wdoc=w.document | | w.contentDocument | | w；
wdoc.open（）；
wdoc.write（内容）；
wdoc.close（）；
打印框（w，选项。超时）
.done（函数（）{
setTimeout（函数（）{
如果（iframeCount==0）{
$iframe.remove（）；
}
}, 100);
})
.失败（功能（错误）{
console.error（“无法从iframe打印”，err）；
printContentInNewWindow（内容、选项、超时）；
})
.always（函数（）{
试一试{
options.deferred.resolve（）；
}捕捉（错误）{
console.warn（'通知延迟的错误'，err）；
}
});
}捕获（e）{
控制台错误（“无法从iframe打印”，e.stack，e.message）；
printContentInNewWindow（内容、选项、超时）
.always（函数（）{
试一试{
options.deferred.resolve（）；
}捕捉（错误）{
console.warn（'通知错误
@media print {
*, :after, :before {
    text-shadow: none!important;
    background: 0 0!important;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}

.invoice {
    width: 100%;
    border: 0;
    margin: 0;
    padding: 0;
}

.invoice-col {
    float: left;
    width: 33.3333333%;
}

.table-responsive {
    overflow: auto;
}

.table-responsive > .table tr th, .table-responsive > .table tr td {
    white-space: normal!important;
}

a, a:visited {
    text-decoration: underline;
}

a[href]:after {
    content: " (" attr(href) ")";
}

abbr[title]:after {
    content: " (" attr(title) ")";
}

a[href^="javascript:"]:after, a[href^="#"]:after {
    content: "";
}

blockquote, pre {
    border: 1px solid #999;
    page-break-inside: avoid;
}

thead {
    display: table-header-group;
}

img {
    page-break-inside: avoid;
}

img {
    max-width: 100%!important;
}

h2, h3, p {
    orphans: 3;
    widows: 3;
}

h2, h3 {
    page-break-after: avoid;
}

select {
    background: #fff!important;
}

.navbar {
    display: none;
}

.btn > .caret, .dropup > .btn > .caret {
    border-top-color: #000!important;
}

.label {
    border: 1px solid #000;
}

.table {
    border-collapse: collapse!important;
}

.table td {
    background-color: #fff!important;
}

thead{
    background-color: #337ab7 !important;
    color: white !important;
}


.table-bordered td, .table-bordered th {
    border: 1px solid #ddd!important;
}
}

(function($) {
"use strict";
function getjQueryObject(string) {
    var jqObj = $("");
    try {
        jqObj = $(string)
                .clone();
    } catch (e) {
        jqObj = $("<span />")
                .html(string);
    }
    return jqObj;
}

function printFrame(frameWindow, timeout) {
    var def = $.Deferred();
    try {
        setTimeout(function() {
            frameWindow.focus();
            try {
                if (!frameWindow.document.execCommand('print', false, null))     {
                    frameWindow.print();
                }
            } catch (e) {
                frameWindow.print();
            }
            frameWindow.close();
            def.resolve();
        }, timeout);
    } catch (err) {
        def.reject(err);
    }
    return def;
}

function printContentInNewWindow(content, timeout) {
    var w = window.open();
    w.document.write(content);
    w.document.close();
    return printFrame(w, timeout);
}

function isNode(o) {
    return !!(typeof Node === "object" ? o instanceof Node : o && typeof o === "object" && typeof o.nodeType === "number" && typeof o.nodeName === "string");
}
$.print = $.fn.print = function() {
    var options, $this, self = this;
    if (self instanceof $) {
        self = self.get(0);
    }
    if (isNode(self)) {
        $this = $(self);
        if (arguments.length > 0) {
            options = arguments[0];
        }
    } else {
        if (arguments.length > 0) {
            $this = $(arguments[0]);
            if (isNode($this[0])) {
                if (arguments.length > 1) {
                    options = arguments[1];
                }
            } else {
                options = arguments[0];
                $this = $("html");
            }
        } else {
            $this = $("html");
        }
    }
    var defaults = {
        globalStyles: true,
        mediaPrint: true,
        stylesheet: "plugins/print/print.css",
        noPrintSelector: ".no-print",
        iframe: true,
        append: null,
        prepend: null,
        manuallyCopyFormValues: true,
        deferred: $.Deferred(),
        timeout: 250
    };
    options = $.extend({}, defaults, (options || {}));
    var $styles = $("");
    if (options.globalStyles) {
        $styles = $("style, link, meta, title");
    } else if (options.mediaPrint) {
        $styles = $("link[media=print]");
    }
    if (options.stylesheet) {
        $styles = $.merge($styles, $('<link rel="stylesheet" href="' + options.stylesheet + '">'));

    }
    var copy = $this.clone();
    copy = $("<span/>")
            .append(copy);
    copy.find(options.noPrintSelector)
            .remove();
    copy.append($styles.clone());
    copy.append(getjQueryObject(options.append));
    copy.prepend(getjQueryObject(options.prepend));
    if (options.manuallyCopyFormValues) {
        copy.find("input")
                .each(function() {
                    var $field = $(this);
                    if ($field.is("[type='radio']") || $field.is("[type='checkbox']")) {
                        if ($field.prop("checked")) {
                            $field.attr("checked", "checked");
                        }
                    } else {
                        $field.attr("value", $field.val());
                    }
                });
        copy.find("select").each(function() {
            var $field = $(this);
            $field.find(":selected").attr("selected", "selected");
        });
        copy.find("textarea").each(function() {
            var $field = $(this);
            $field.text($field.val());
        });
    }
    var content = copy.html();
    try {
        options.deferred.notify('generated_markup', content, copy);
    } catch (err) {
        console.warn('Error notifying deferred', err);
    }
    copy.remove();
    if (options.iframe) {
        try {
            var $iframe = $(options.iframe + "");
            var iframeCount = $iframe.length;
            if (iframeCount === 0) {
                $iframe = $('<iframe height="0" width="0" border="0" wmode="Opaque"/>')
                        .prependTo('body')
                        .css({
                            "position": "absolute",
                            "top": -999,
                            "left": -999
                        });
            }
            var w, wdoc;
            w = $iframe.get(0);
            w = w.contentWindow || w.contentDocument || w;
            wdoc = w.document || w.contentDocument || w;
            wdoc.open();
            wdoc.write(content);
            wdoc.close();
            printFrame(w, options.timeout)
                    .done(function() {
                        setTimeout(function() {
                            if (iframeCount === 0) {
                                $iframe.remove();
                            }
                        }, 100);
                    })
                    .fail(function(err) {
                        console.error("Failed to print from iframe", err);
                        printContentInNewWindow(content, options.timeout);
                    })
                    .always(function() {
                        try {
                            options.deferred.resolve();
                        } catch (err) {
                            console.warn('Error notifying deferred', err);
                        }
                    });
        } catch (e) {
            console.error("Failed to print from iframe", e.stack, e.message);
            printContentInNewWindow(content, options.timeout)
                    .always(function() {
                        try {
                            options.deferred.resolve();
                        } catch (err) {
                            console.warn('Error notifying deferred', err);
                        }
                    });
        }
    } else {
        printContentInNewWindow(content, options.timeout)
                .always(function() {
                    try {
                        options.deferred.resolve();
                    } catch (err) {
                        console.warn('Error notifying deferred', err);
                    }
                });
    }
    return this;
    };
})(jQuery);

function printAll() { // added by me
    $('#table').print();
}

table{
    page-break-inside: auto;
}

tr{
    page-break-inside: avoid;
}

.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left;
}
.col-sm-12 {
    width: 100%;
}
.col-sm-11 {
    width: 91.66666667%;
}
.col-sm-10 {
    width: 83.33333333%;
}
.col-sm-9 {
    width: 75%;
}
.col-sm-8 {
    width: 66.66666667%;
}
.col-sm-7 {
    width: 58.33333333%;
}
.col-sm-6 {
    width: 50%;
}
.col-sm-5 {
    width: 41.66666667%;
}
.col-sm-4 {
    width: 33.33333333%;
}
.col-sm-3 {
    width: 25%;
}
.col-sm-2 {
    width: 16.66666667%;
}
.col-sm-1 {
    width: 8.33333333%;
}
.col-sm-pull-12 {
    right: 100%;
}
.col-sm-pull-11 {
    right: 91.66666667%;
}
.col-sm-pull-10 {
    right: 83.33333333%;
}
.col-sm-pull-9 {
    right: 75%;
}
.col-sm-pull-8 {
    right: 66.66666667%;
}
.col-sm-pull-7 {
    right: 58.33333333%;
}
.col-sm-pull-6 {
    right: 50%;
}
.col-sm-pull-5 {
    right: 41.66666667%;
}
.col-sm-pull-4 {
    right: 33.33333333%;
}
.col-sm-pull-3 {
    right: 25%;
}
.col-sm-pull-2 {
    right: 16.66666667%;
}
.col-sm-pull-1 {
    right: 8.33333333%;
}
.col-sm-pull-0 {
    right: auto;
}
.col-sm-push-12 {
    left: 100%;
}
.col-sm-push-11 {
    left: 91.66666667%;
}
.col-sm-push-10 {
    left: 83.33333333%;
}
.col-sm-push-9 {
    left: 75%;
}
.col-sm-push-8 {
    left: 66.66666667%;
}
.col-sm-push-7 {
    left: 58.33333333%;
}
.col-sm-push-6 {
    left: 50%;
}
.col-sm-push-5 {
    left: 41.66666667%;
}
.col-sm-push-4 {
    left: 33.33333333%;
}
.col-sm-push-3 {
    left: 25%;
}
.col-sm-push-2 {
    left: 16.66666667%;
}
.col-sm-push-1 {
    left: 8.33333333%;
}
.col-sm-push-0 {
    left: auto;
}
.col-sm-offset-12 {
    margin-left: 100%;
}
.col-sm-offset-11 {
    margin-left: 91.66666667%;
}
.col-sm-offset-10 {
    margin-left: 83.33333333%;
}
.col-sm-offset-9 {
    margin-left: 75%;
}
.col-sm-offset-8 {
    margin-left: 66.66666667%;
}
.col-sm-offset-7 {
    margin-left: 58.33333333%;
}
.col-sm-offset-6 {
    margin-left: 50%;
}
.col-sm-offset-5 {
    margin-left: 41.66666667%;
}
.col-sm-offset-4 {
    margin-left: 33.33333333%;
}
.col-sm-offset-3 {
    margin-left: 25%;
}
.col-sm-offset-2 {
    margin-left: 16.66666667%;
}
.col-sm-offset-1 {
    margin-left: 8.33333333%;
}
.col-sm-offset-0 {
    margin-left: 0%;
}
.visible-xs {
    display: none !important;
}
.hidden-xs {
    display: block !important;
}
table.hidden-xs {
    display: table;
}
tr.hidden-xs {
    display: table-row !important;
}
th.hidden-xs,
td.hidden-xs {
    display: table-cell !important;
}
.hidden-xs.hidden-print {
    display: none !important;
}
.hidden-sm {
    display: none !important;
}
.visible-sm {
    display: block !important;
}
table.visible-sm {
    display: table;
}
tr.visible-sm {
    display: table-row !important;
}
th.visible-sm,
td.visible-sm {
    display: table-cell !important;
}

To prevent overflow of table to the right if the table width is too much, Add these.

body {
    overflow-x: visible;
    overflow-y: visible;
}

Hope this helps someone.