css - 打印模态弹出窗口的内容

Question

我有一个显示元素列表的应用程序。

用户可以单击某个元素并在模式弹出窗口(居中的 DIV，使用 JavaScript 显示)中查看其详细信息。我需要在该弹出窗口上有一个按钮，允许用户仅打印出模式弹出窗口的内容。

这适用于仅需要在 IE7+ 中运行的内部应用程序。当用户单击模态弹出窗口上的打印按钮时，元素的状态将更改为“已打印”(出于内部业务原因...)。

我正在使用 ASP.NET 和 ASP.NET AJAX Control Toolkit ModalPopupExtender ，但我猜测实现这一目标的技术将以浏览器为中心，并且与服务器技术无关。

Answer 1

您可以将“noprint”类名添加到 div 中，将您不想打印的所有内容都包装起来。

如果您还希望主页可以在没有对话框的情况下打印，您可以在用户按下 PRINT 按钮时将类名添加到包装器 DIV 中，然后删除类名。

@media print {
.noprint {
 display:none
}
}