仅打印可见DIV

Question

我在html页面中创建了许多div / blocks，它能够显示所选的块并隐藏未选择的块。

但是在打印时，它无法仅打印所选的块。它将打印所有选定的以及所有隐藏的块。

我只能打印那些用户选择要打印的块而不打印那些隐藏的块？

Answer 1

你的样式表中有这样的东西。假设隐藏的块有一类隐藏，并且选择了一类被选中。

@media print
{

  div,.hidden{display:none;}
  .chosen{display:block;}
}

Google打印样式表以获取更多信息。 请参阅：Hide Text From Printing

Answer 2

您可以使用仅针对打印视图的媒体查询来一般性地创建打印样式表：

@media print {
      .class-i-want-to-show {
          width: 100%;
      }

      .class-i-want-to-hide {
          display: none;
      }
}

要动态隐藏打印视图中的元素，您可以查看所有通过其他函数将某些无打印类应用于它们的div并告诉它们显示：none;在您的打印页面上。

$( "div" ).parent( ".dont-print-me" ).css( "display", "none" );

我必须更多地了解您为推荐更全面的脚本而想要做些什么。