使用 Javascript 打印？答案

【问题标题】：Print using Javascript?使用 Javascript 打印？
【发布时间】：2009-04-19 06:55:50
【问题描述】：

我的网页中有特定的部门。我只想在我的网页中单击“打印”时打印该 div。我有一些 javascript 代码。但这不是很好的格式。

是否有任何 javascript 可以从我的网页打印特定的部门？

提前致谢

格纳尼亚尔祖拜尔

【问题讨论】：

您介意将此标记为“已回答”吗？

标签： javascript css printing

【解决方案1】：

您可以指定 CSS 样式表 with the attribute media="print" 并将样式 display: none; 应用于除您要打印的元素之外的所有元素。

例如：

print.css

* { display: none; }
div.print_block { display: block; }

page.html

<HEAD>
<LINK rel="stylesheet" type="text/css" 
     media="print" href="print.css" />
</HEAD>

<DIV class="print_block">
   ...
</DIV>

【讨论】：

谢谢安迪...然后在打印按钮 onclick 我必须给 onclick='window.print()'。那么它只会打印那个div。对吗？
是的，尽管 JavaScript 并不真正相关；当用户转到文件->打印自己时也会发生同样的情况。
是的。它应用 media="print" 样式。您可以通过将标签更改为 media="screen" 来测试而不打印（确保它是最后一个引用的样式表。

【解决方案2】：

如果您想在打印时隐藏某些 div，可以在样式表的打印媒体部分将它们设置为“显示：无”，它们不会出现。

例如，在您的样式表中：

 @media print {

    div.header {
        display: none;
    }

    div.printable {
        page-break-inside: avoid;
        page-break-after: always;
    }
 }

这个答案与比我快 4 分钟的两个答案几乎完全相同 :-) ，请注意，如果您不想这样做，则不需要完整的单独样式表...

另外，“page-break-inside：避免；”和“分页后：总是；”条款很好用于打印出几个 div，每个 div 都在自己的页面上。

【讨论】：

【解决方案3】：

检查这个 jQuery 插件jqPrint。它似乎做你想做的事。

【讨论】：

【解决方案4】：

我认为没有直接的方法可以做到这一点。但是，您可以：

为 media=print 创建一个特殊的 CSS，其中除了您要打印的一个 div 之外的所有 div 都被隐藏，或者
为要打印的内容使用隐藏的 iframe

使用术语“javascript print partial page”进行谷歌搜索可能会帮助您找到一些教程。

【讨论】：

CSS 会是更好的选择。
当然，但我也看到页面也使用 iframe，为了完整起见提到它。

【解决方案5】：

我在工作的一个项目中看到了这样的 smf。您必须在弹出窗口中打开弹出窗口，然后将要打印的父页面中的内容放入其中。这就是全部:)

【讨论】：