2

我有一个javascript打印功能：

    function printDetails() {
        var printContent = document.getElementById('<%= divMail.ClientID %>');

        var windowUrl = 'about:blank';
        var uniqueName = new Date();
        var windowName = 'Print' + uniqueName.getTime();
        var printWindow = window.open(windowUrl, windowName, 'left=500,top=500,width=0,height=0');
        printWindow.document.write(printContent.innerHTML);

        printWindow.document.close();
        printWindow.focus();
        printWindow.print();

        printWindow.close();

        return false;
    }

我有以下 HTML：

<div id="divMail" runat="server" >
    <div id="showTopDetailsContent" style="display: none; position:relative;">
        MORE HTML
    </div>
</div>

以及以下 JQuery/脚本：

$('#showTopDetailsContent').toggle(300);

问题：当我打印时，我得到了 divMail (DIV) 的内容并将它们发送到打印功能，问题是因为我在 divMail 中有一个隐藏的 DIV，它不会显示在打印中。如何使隐藏 DIV 的打印功能显示？

4

3 回答 3

3

试试这个：

printWindow.document.getElementById('showTopDetailsContent').style.display='block';

之后

printWindow.document.write(printContent.innerHTML);
于 2013-04-22T19:16:14.170 回答
2

您可以将其指定为可见以在 CSS 中打印：

@media screen {
    #showTopDetailsContent { display: none; }
    #showTopDetailsContent.show { display: block; }
}
@media print {
    #showTopDetailsContent { display: block !important; }
}

而不是使用.toggle()which 应用内联样式，而是使用一个类。

$('#showTopDetailsContent').toggleClass('show');
于 2013-04-22T19:03:15.323 回答
0

你需要在 CSS 中抑制边框

/* stop page from printing footer */
@page {
    size: auto;   /* auto is the initial value */
    margin: 0mm;  /* this affects the margin in the printer settings */
}

但这会使您的内容接近边缘，因此我会将所有内容都包装在带有一些填充的 DIV 中

于 2017-09-08T22:12:50.907 回答