0

我有一个图像，它是一个转换为图像画布的图像（我使用canvas2image.js插件来做到这一点）：

function draw_voucher_img()
{
    var canvas = $("#canvas_voucher")[0];
    var voucher = canvas.toDataURL();
    $("#voucher_img").attr("src", voucher);
}

然后单击一个按钮，我想打印该图像。我正在使用jquery.printElement.min.js插件来做到这一点：

$("#div_print_voucher").click(function() {
    print_voucher();
});


function print_voucher()
{
    $("#voucher_img").printElement();
}

它适用于除... Internet Explorer 之外的所有浏览器。在资源管理器中，它不打印图像，而是打印页面的其余部分。有没有其他方法可以让它在 IE 中工作？

**更新**

有没有其他方法可以使用 JS 或 jQuery 打印元素？如果有，那么也许有可能以某种方式检查用户的浏览器是否是 IE：如果是：使用一种打印方法，如果不是 - 上述功能。

*没关系，问题解决了*

4

1 回答 1

1

也许这不是最优雅的解决方案，但它对我有用。我找到了一段用于打印 HTML5 画布的代码——它将画布转换为图像，在正文中创建一个只有标签的弹出窗口<img...>，将转换后的图像设置为源，弹出打印对话框，一旦打印开始它关闭该弹出窗口。所以现在我只需要检查浏览器是 IE 还是其他浏览器。如果是 IE - 使用上面提到的代码，如果是其他浏览器 - 使用问题中提到的功能。所以完整的代码现在看起来像这样：

function print_voucher()
{
var ua = navigator.userAgent;
if(ua.search(/MSIE/) > 0)
{
    var dataUrl = document.getElementById('canvas_voucher').toDataURL(); 
    var windowContent = '<!DOCTYPE html>';
    windowContent += '<html>'
    windowContent += '<head><title>Print voucher</title></head>';
    windowContent += '<body>'
    windowContent += '<img src="' + dataUrl + '">';
    windowContent += '</body>';
    windowContent += '</html>';
    var printWin = window.open('','','width=788,height=499');
    printWin.document.open();
    printWin.document.write(windowContent);
    printWin.document.close();
    printWin.focus();
    printWin.print();
    printWin.close();
} else {
    $("#voucher_img").printElement();
}

}
于 2013-10-10T08:24:16.950 回答