Question

我有一个显示项目列表的应用程序。

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

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

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

Answer 1

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

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

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

Answer 2

您可以重定向到包含模态弹出窗口内容的可打印页面。确保该页面在load事件中有window.print（）。一旦您的用户到达该页面，您就可以标记该页面。

如果用户到达并取消打印，会发生什么？

Answer 3

试试这个

function PrintContent() {

var DocumentContainer = document.getElementById('nameofDiv');
var WindowObject = window.open("", "PrintWindow",
"width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes");
WindowObject.document.write();
WindowObject.document.write('<link rel="stylesheet" type="text/css" href="path-to-my-stylesheet.css">')
WindowObject.document.writeln(DocumentContainer.innerHTML);
WindowObject.document.close();
WindowObject.focus();
WindowObject.print();
WindowObject.close();
}

这将使用样式表

在另一个窗口中打印出内容

Answer 4

要使用不同的样式（例如，不居中，100％宽度）渲染弹出内容，我会在打印时动态更新_foregroundElement（PopupControlID）和_backgroundElement（由弹出扩展器创建）的位置。

var basePrint = window.print;
window.print = function() {
  var popup = $find( '<%= [PopupExtenderID].ClientID %>' );
  popup._backgroundElement.style.position = 'static';
  popup._foregroundElement.style.position = 'static';
  popup._layout();
  basePrint();
  // Restore settings for display
  popup._backgroundElement.style.position = 'fixed';
  popup._foregroundElement.style.position = 'fixed';
  popup._layout();
  }

注意：无法使用浏览器的打印按钮。

打印模态弹出窗口的内容

4 个答案: