Question

Chrome 24

我现在正在重新编写一个具有奇特功能的网站。有一个页面，用户可以在其中选择要选择要打印的图像的选项列表。

用户勾选他们想要的图像的复选框，然后他们点击一个按钮，回拨给服务器，并且给定的图像将想要的HTML注入隐藏的DIV。

更复杂的是，图像src属性实际上是一个指向.NET MVC服务器端操作的链接，用于从我们抓取图像的数据库中检索图像，然后在几个不同的位置渲染图像上的一些文本

输出HTML最终看起来像这样。

<div style="visibility: hidden;">
    <div id="PrintArea">
         <div><img width="1000" src="/Controller/GetImage/2"></div>
        <div><img width="1000" src="/Controller/GetImage/3"></div>
        <div><img width="1000" src="/Controller/GetImage/5"></div>
    </div>    
</div>

这是javascript中的第一步，ajax回调服务器以填充此PrintArea DIV。在此之后，我们执行以下操作：

//Print
$('#PrintArea').waitForImages(function () {
    $("#PrintArea").jqprint({ importCSS: true });
    //$.unblockUI();
});

为了适应加载图像的服务器端，我们使用waitForImages jquery插件，然后使用jqprint打印内容。

要完成等式，我们有一个打印样式表（主样式表是media =“screen”，因此它应该是唯一正在播放的样式表。）

body * {
    visibility:hidden;
  }

#PrintArea, #PrintArea * { visibility: visible; }

#PrintArea { position: absolute;left: 0;top: 0; }

img { display: block !important; }

这在Firefox和IE中运行良好。

Chrome无法始终。会发生的情况是，当选择三个图像时，前两个图像将显示，但第三个图像应显示在第二页有时，将显示和打印，但其他时间则不会。它似乎是零星的，非常随机。

任何建议或想法或如何让Chrome在分页符中始终如一地打印图像？我们内部的思路是，Chrome的打印预览窗口实际上是在waitForImages调用完成之前呈现的，因此内容没有显示，但我没有想出具体的测试方法。

由于

Answer 1

也许尝试窗口加载：

$(window).load(function() {
    // executes when complete page is fully loaded, including all frames, objects and images
    $('#PrintArea').waitForImages(function () {
        $("#PrintArea").jqprint({ importCSS: true });
        //$.unblockUI();
    });
});

完整页面完全加载后，窗口加载事件会稍后执行，包括所有帧，对象和图像。因此，涉及图像或其他页面内容的函数应放在窗口或内容标记本身的加载事件中。

<强>源： http://4loc.wordpress.com/2009/04/28/documentready-vs-windowload/

关于Chrome问题： http://forum.jquery.com/topic/document-ready-and-window-onload-difference

希望它有所帮助！

在隐藏的DIV中打印图像在Chrome中失败

1 个答案: