javascript - 在 laravel 中打印特定的 div 标签

Question

我需要在 laravel 的特定 div 中打印全部内容。到目前为止，我可以用 javascript 打印这个 div 标签。但是结果不是很好，因为打印时不包含 css。有没有更好的方法来完成这件事？这是我的代码。

<div id="reportPrinting">
    <div class="row pt-50">
        <div class="col-sm-10 col-sm-offset-1">
            //i cut this part because it to long
        </div>
    </div>
</div>

<form>
    <input type="button" value="Print this page" onClick="printReport()">
</form>

<script type="text/javascript">
    function printReport()
    {
        var prtContent = document.getElementById("reportPrinting");
        var WinPrint = window.open();
        WinPrint.document.write(prtContent.innerHTML);
        WinPrint.document.close();
        WinPrint.focus();
        WinPrint.print();
        WinPrint.close();
    }
</script>

我使用“打印此页”按钮来触发打印过程。

Answer 1

您需要将 css 写入文档并将 screen 更改为 print(或 all)才能使 css 正常工作:

document.write( "<link rel='stylesheet' href='style.css' type='text/css' media='print'/>" );