Question

我正在尝试在新窗口中打印表格。问题是，print尝试在呈现页面之前进行打印。我怀疑document.write是异步的。我尝试使用document.outerHTML / document.innerHTML而不是document.write()，但CSS / JS文件未正确解析为CSS。该表包含在缓存中加载的单元格中的图像，也在window.print()之后。

请，任何想法都会有所帮助。

function printData() {
    let newWin = window.open("");
    styles="";

    //read styles in different page
    Array.prototype.forEach.call(
      document.querySelectorAll("link, style"), 
      function(el){
      styles += (el.outerHTML);
    });

   //DOESNT WORK NOT RENDER STYLES
   // newWin.document.document.querySelector("html").innerHTML=(styles + document.querySelector("table").outerHTML);
    //THIS FINISHES RENDERING AFTER PRINT
      newWin.document.write(styles + document.querySelector("table").outerHTML);

      //DOESNT WORK 
      newWin.document.addEventListener("DOMContentLoaded", function(){
      if(newWin.document.addEventListener === "loading"){
          newWin.print();
      }
      //DOESNT WORK
      newWin.window.onload= function(){
          newWin.print();
      }

      //WORKS
      setTimeout(function(){
        newWin.print();
        newWin.close();
      }, 2000);
    });
}

Answer 1

尝试类似：

let printAndClose = '<script>onload = function() { window.print(); window.close(); }</sc' + 'ript>';

newWin.document.write(
  styles +
  document.querySelector("table").outerHTML) +
  printAndClose
);

Answer 2

使用window.onload启动您的功能，因为它等待加载页面的所有内容并得到广泛支持。

Answer 3

我通过将以下代码附加到<body>的末尾来解决了类似的问题。它适用于IE11，Chrome和Firefox。在没有包裹window.close()的情况下调用setTimeout()会导致IE11在显示打印对话框之前关闭窗口。

<script type="text/javascript">
    setTimeout(function() {
        window.print();
        setTimeout(function() {window.close();});
    });
</script>

window.print（）尝试在完成渲染之前打印页面（动态创建）

3 个答案: