我正在一个个人项目中,我想要一个按钮来打印<div>
元素的内容。一切在台式机上都可以运行,但是以某种方式无法在移动设备上打印,文字为“打印页面时出现问题。请重试。” 检查时,Chrome开发者工具上没有错误或警告在桌面上。这是我正在使用的代码:
App.component.html的一部分:
<div id="1">
<h3 class="title">Some Title</h3>
<p class="subtitle">Some Text</p>
<a id="1-print">Print</a>
</div>
App.component.ts的一部分:
const printQuote = (id) => {
const content = document.getElementById(id).innerHTML;
const printWindow = window.open('', 'Print', 'height=600,width=800');
printWindow.document.write('<html><head><title>Print</title>');
printWindow.document.write('</head><body>');
printWindow.document.write('<h1>QuotesWorld</h1>');
printWindow.document.write(content);
printWindow.document.write('</body></html>');
printWindow.document.close();
printWindow.focus();
printWindow.print();
printWindow.close();
};
const printArr = ['1-print', '2-print', '3-print', '4-print', '5-print',
'6-print', '7-print', '8-print', '9-print', '10-print',
'11-print', '12-print', '13-print', '14-print', '15-print',
'16-print', '17-print', '18-print', '19-print', '20-print',
... '55-print', '56-print'];
const quotArr = [];
for (let i = 0; i < 56; i++) {
quotArr[i] = i + 1;
document.getElementById(printArr[i]).addEventListener('click', () => {
printQuote(quotArr[i]);
});
}
当桌面用户单击该元素时,它会打开一个带有打印对话框的新窗口,但是,这会导致移动设备出错。感谢帮助:)
答案 0 :(得分:0)
我没有使用此功能,但我认为问题在于您在此处为窗口大小提供的宽度和高度:
i
尝试为移动设备创建较小的窗口。