打印从服务器加载的内容

Question

加载整个页面后，我正在通过 JS 从服务器加载一些图片。 意味着通过用户点击我正在加载一些图像并将其插入 DOM。

此图像具有唯一 ID，现在我只想通过 JS 帮助打印出此图像。 我为打印目的做了样式文件

* {
    display:none;
    visibility: none;
}
html, body, #out_image_1 {
    background: none;
    display: block !important;
    left: 0px;
    margin: 0px;
    padding: 0px;
    position: relative;
    top: 0px;
}

并调用 print 这样的

$("#print-button2").click(function() {
    window.print();
    return false;
})

但是页面是空白的（空的）我错在哪里？

谢谢

Answer 1

它可能无法打印有几个原因。

• 您的图像可能包含在另一个元素中，但根据您的 CSS，父元素仍然是 display:none

  只有当 #out_image_1 是 body 的直接子代时，您的 CSS 才会起作用：
  http://jsfiddle.net/RXMx8/

  但如果#out_image_1 有除body 和html 之外的任何父元素，则不会：
  http://jsfiddle.net/RXMx8/1/

我打赌这就是问题所在，但其他原因可能是：

• 默认情况下，您的浏览器未设置为打印图像。使用window.print() 可能会跳过“打印预览”，这可以让您打开此设置。

• 您的 HTML 没有问题，但您定位到了错误的元素。

• 你的墨水用完了； )

即使您使用 javascript 添加元素，您仍然应该能够打印它。对于调试，删除* { display:none; } 看看会发生什么。

^{* 对了，应该是visibility: hidden;； "none" 不是一个有效值，但它与 display:none 是多余的，所以你根本不需要它。}