在应用CSS的情况下打印div内容

编程入门 行业动态 更新时间:2024-10-28 04:21:00
本文介绍了在应用CSS的情况下打印div内容的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述

我正在一个项目上,我想打印div内容.我正在使用的代码可以满足我的要求,但是我得到的输出很简单,没有应用Css,也没有得到图像.请帮助我.我要附加代码并输出我想要的输出.

I am working on a project and I want to print div content.The code which I am using is fulfilling my requirements,but I am getting simple output without Css applied to it and also not getting the image.Please help me.I am attaching the code and output I am getting and output I want.

代码:

function PrintElem(elem) { Popup($(elem).html()); } function Popup(data) { var mywindow = window.open('', 'new div', 'height=400,width=600'); mywindow.document.write('<html><head><title></title>'); mywindow.document.write('<link rel="stylesheet" href="css/midday_receipt.css" type="text/css" />'); mywindow.document.write('</head><body >'); mywindow.document.write(data); mywindow.document.write('</body></html>'); mywindow.print(); mywindow.close(); return true; }

我在单击打印按钮之前得到的输出:

Output I am getting before clicking print button:

我通过单击打印按钮得到的输出:

Output I am getting by clicking print button:

推荐答案

如果要渲染CSS,则必须在打印之前添加超时,因为将CSS应用于HTML需要花费一些时间,然后您就可以进行打印.

If you wanna render the CSS you must add a timeout before printing it because it takes some time for CSS to be applied to the HTML and then you will be able to print it.

尝试一下:

function Popup(data) { var mywindow = window.open('', 'new div', 'height=400,width=600'); mywindow.document.write('<html><head><title></title>'); mywindow.document.write('<link rel="stylesheet" href="css/midday_receipt.css" type="text/css" />'); mywindow.document.write('</head><body >'); mywindow.document.write(data); mywindow.document.write('</body></html>'); mywindow.document.close(); mywindow.focus(); setTimeout(function(){mywindow.print();},1000); mywindow.close(); return true; }

更多推荐

在应用CSS的情况下打印div内容

本文发布于:2023-11-05 08:59:51,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1560418.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:情况下   内容   CSS   div

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!