javascript - 使用 css 打印 div 内容

标签 javascript asp.net css

我正在做一个元素,我想打印 div 内容。我使用的代码满足了我的要求,但我得到的是简单的输出,没有应用 Css,也没有得到图像。请帮助我。我附上了我得到的代码和输出以及我想要的输出。

代码:

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;
}

我在点击打印按钮之前得到的输出: enter image description here

点击打印按钮得到的输出: enter image description here

最佳答案

如果你想呈现 CSS,你必须在打印之前添加一个超时,因为 CSS 需要一些时间才能应用到 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.document.close();
      mywindow.focus();
      setTimeout(function(){mywindow.print();},1000);
      mywindow.close();

      return true;
}

关于javascript - 使用 css 打印 div 内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21379605/

相关文章:

javascript - 使用 Event.target 和类关闭屏幕外导航

c# - 获取不同的列表值

asp.net - 可以在 web.config 中使用预处理器指令吗?

html - 如何在标题下方对齐网页上的内容

javascript - 用变量替换字符串的变量名的子字符串

javascript - foreach 循环未更新数据和 undefined variable 错误

asp.net - 如何使用 jQuery/JSON/AJAX 将字符串传递到 ASP.NET Web 服务

html - 在 Rails 中丢失图像 src

javascript - 如何选择:after element using jquery

javascript - 在视野之外时暂停 HTML5 视频