Question

我的jsp页面中有一个必须打印的div。单击打印按钮时，一切正常，但布局设计除外（无法打印确切的样式）。谷歌搜索后，我知道这是因为CSS链接，需要明确添加。当我添加相同的内容时，似乎我的引导链接无法正常工作。任何人都可以建议同样的最佳解决方案。以下是我的代码： div的预览需要打印：

点击打印按钮时执行的代码是：

function printReceipt(){
         console.log("Printing the receipt");

         var contents = $("#receipt").html();
         var frame1 = $('<iframe />');
         frame1[0].name = "frame1";
         frame1.css({ "position": "absolute", "top": "-1000000px" });
         $("body").append(frame1);
         var frameDoc = frame1[0].contentWindow ? frame1[0].contentWindow : frame1[0].contentDocument.document ? frame1[0].contentDocument.document : frame1[0].contentDocument;
         frameDoc.document.open();
         //Create a new HTML document.
         frameDoc.document.write('<html><head><title></title>');
         frameDoc.document.write('<link type="text/css" rel="stylesheet" href="<spring:url value="/resources/css/bootstrap.min.css" />">');
         frameDoc.document.write('<link type="text/css" rel="stylesheet" href="<spring:url value="/resources/css/hmsCss.css" />">');             

         frameDoc.document.write('</head><body>');

         //Append the DIV contents.
         frameDoc.document.write(contents);
         frameDoc.document.write('<script type="text/javascript" src="<spring:url value="/resources/js/jquery.min.js"/>"><\/script>');
         frameDoc.document.write('<script type="text/javascript" src="<spring:url value="/resources/js/bootstrap.min.js"/>"><\/script>');
         frameDoc.document.write('</body></html>');
         frameDoc.document.close();
         setTimeout(function () {
             window.frames["frame1"].focus();
             window.frames["frame1"].print();
             frame1.remove();
         }, 500);
     }

我打印收据的格式：

已打印收据标题的布局已更改。如何使其与预览格式完全一致。任何建议都会很明显。

Answer 1

尝试如下：

<spring:url value="/resources/css/bootstrap.min.css" var="bsmin" />
     ...
<script>
function printReceipt(){
     ...
         frameDoc.document.write('<link type="text/css" rel="stylesheet" href="${bsmin}">');
     ...
}

单击打印按钮时获取jsp页面的确切布局

1 个答案: