我正在尝试使用printThis jQuery插件在我的网页上打印一些“已选择”的内容。当我按print_btn
时,打印件中不显示任何图像或<hr>
。为什么呢?
HTML
<button id="print_btn"></button>
<div class="elementBricka display" style="page-break-after:always">
<div class="lkbLoggo"></div>
<hr>
....
CSS
#elementBrickor{
align-items: center;
}
.elementBricka{
width: 9.614cm;
height: 14.404cm;
border: 1px solid;
background-color: white;
float: none;
margin-left: auto;
margin-right: auto;
}
.lkbLoggo{
width: 9.182cm;
height: 2.721cm;
margin-top: 0.199cm;
background-image: url("/img/lkb_logga2.png");
background-repeat: no-repeat;
background-position: center;
}
JS
$(document).ready(function () {
$('#print_btn').click(function () {
$('.display').printThis({
debug: true,
importCSS: true,
importStyle: true,
loadCSS: "/Data.css",
pageTitle: false,
});
});
});
更新
我会回答我自己的问题
这与“PrintThis”无关
这是一个浏览器“问题”
但是在我的Css文件中添加!important
很容易解决,我加载了img。
答案 0 :(得分:0)
图像通常不会打印,因为这是浏览器中的设置。
转到工具/ Internet选项/高级/并确保&#34;打印背景和图像&#34;被勾选。
但是,没有解决方法可以使用printThis插件来打印图像。
如果您想尝试使用jquery打印图像,可以这样做:http://jsfiddle.net/8dXvt/626/
function nWin() {
var w = window.open();
var html = $("#toNewWindow").html();
/*for(var i=0;i<5;i++){
$("#toNewWindow").clone().prependTo("body")
}*/
$(w.document.body).html(html);
setTimeout(function(){w.print()}, 1500);
}
答案 1 :(得分:0)
好的,所以没有办法让“PrintThis”打印我的图像 但我在CSS中找到了一种方法:
.lkbLoggo{
width: 9.182cm !important;
height: 2.721cm !important;
margin-top: 0.199cm !important;
background-image: url("/img/lkb_logga2.png") !important;
background-repeat: no-repeat !important;
background-position: center !important;
}
只需在每行后添加!important
即可在打印件中显示
现在..我想要一个让整个班级变得重要的功能,而不是将其添加到每一行。
答案 2 :(得分:0)
$('.display').printThis({
base='true'
});
试试这个
答案 3 :(得分:0)
我的解决方案是实施
-webkit-print-color-adjust:完全!important;