gpt4 book ai didi

javascript - 打印窗口不会在 chrome 最新版本中打印整页

转载 作者:搜寻专家 更新时间:2023-10-31 21:47:25 25 4
gpt4 key购买 nike

我正在开发一个使用 HTML5 canvas 的打印工具。通过打开一个新窗口并将页面 Canvas 写为新窗口文档中的图像,然后最终打印窗口文档。作为测试,我尝试在 chrome 最新版本(版本 46.0.2490.71)中打印页面(大于 100 页) ) 它不会打印整页。在 chrome 打印预览窗口中只显示部分页面,如果我们打印 110 页文档意味着它只显示 24 或 38 页(它随机显示页面)。但是整个页面都添加到新创建的打印窗口中。我使用以下代码打印页面。

var _printWindow = window.open('');
_printWindow.document.write('<html><BODY>');
_printWindow.document.write('<center>');
for (var i = 1; i <= _totalPages; i++) {
var canvas = this._printpages(i);
_printWindow.document.write('<img src="' + canvas.toDataURL() + '"style="border:1px solid;height:"' + _pageHeight + '"px;margin:0px"><br />');
}
_printWindow.document.write('</center></body></html>');
_printWindow.document.close();
_printWindow.print();

最佳答案

您正在调用 print()在你写完 <img> 之后直接标签。但是,加载所有这些图像需要时间(异步)。因此,当您调用 print() 时,图片还没有完成加载,有些可能还没有确定它们的高度,导致页面数量意外。

要解决此问题,您应该调用 print()仅在 onload 之后事件已触发所有图像元素。这是我解决它的方法:

var nImages = _totalPages;
function imageLoaded() {
if (--nImages === 0) {
_printWindow.print();
}
}

// ...snip...

// replace your `for` loop with the following:
for (var i = 1; i <= _totalPages; i++) {
var img = new Image;
img.addEventListener('load', imageLoaded);
img.src = /* get the data URL from the canvas */;

// here, add in your style properties

_printWindow.document.body.appendChild(img);
}

关于javascript - 打印窗口不会在 chrome 最新版本中打印整页,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34216458/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com