Question

我首先注意到我的主模块带有一个动态填充<div id='printableArea'></div>的下拉列表。在这个div中，动态内容将提供（1）打印按钮：<input id='printButton' type='button' value='Print'>和（2）jQuery将内容输出到空白页面进行打印：

$('#printButton').on('click',function(){
    printData();
});

function printData() {
    var divToPrint = document.getElementById("printableArea");
    newWin = window.open("","_blank");
    newWin.document.write('<html><head><title></title><style type="text/css">@page {  size: portrait; -webkit-print-color-adjust:economy;}' + '</style></head><body>');
    newWin.document.write(divToPrint.outerHTML);
    newWin.document.write('</body></html>');

    setTimeout(function(){
        newWin.print();
    }, 1000);

    return false;
}

它似乎工作但不是所有时间。单击打印按钮后，将出现新窗口，其中包含预期的动态内容，但不显示打印对话框（在Chrome中）。如果我使用下拉列表切换回主页面然后切换回新窗口，则会显示打印对话框。我猜想，一旦主页再次收到焦点，就会触发setTimeout ......我做了这个假设，因为我注意到打印按钮仍然处于焦点状态，就好像我点击并按住它一样。

我一直试图解决这个问题几个小时而且我已经放弃了。有什么建议吗？

Answer 1

找到了一个变通方法/解决方案......之前尝试过，但由于语法不好而导致失败（因为我正在使用PHP而没有正确转义）。

newWin.document.write('\\x3Cscript>');   // Escaped <script>
newWin.document.write('print();');
newWin.document.write('\\x3C/script>');  // Escaped </script>

- 感谢Taplar再次提出这种方法。

使用AJAX进行JavaScript打印失败

1 个答案: