0
这里是我从所选择的元素容器在打印预览对话,背景颜色或背景的CSS设置不渲染
function printDiv() {
var divContent='<div id="cosbox_holder">' + $("#cosbox_container").html() + '</div><div class="tablewrapper"><table border="0" cellpadding="0" cellspacing="0">' + $("#rsr_table").html() + '</table></div>';
//cosbox_container
var mywindow = window.open('', 'my div', 'height=600,width=1000');
var htm = '<html><head><title>Receipt</title>' +
'<style>' +
'#cosbox_holder{max-width: 100%; max-height: 100%; clear: both; float: none; width: 100%; display: table;}' +
'.col-sm-2{padding: 2px; width: 49%; display: inline-block; float: left; margin: 0px;}' +
'.cosbox{padding: 0px; height:97px; font-size:13px; background: red !important; background-color: red !important;}' +
// '.cosbox .cosbox_header{padding:5px;margin:0;font-weight:bold;color:#fff;background:rgba(0,0,0,.1);overflow:hidden}' +
'table{width: 100%;background-color: blue !important;}' +
'table, table td, table th{font-size: 13px; text-align: center; margin: 0px;}' +
'.tablewrapper{border: 1px solid #cccccc;}' +
'table th{border-bottom: 2px solid #cccccc;}' +
'table td{padding: 3px;border-bottom: 1px solid #cccccc;}' +
'table tr:last-child td{border-bottom: none !important;}' +
'</style>' +
'</head><body ><div id="j_print">'+divContent+'</div></body></html>';
mywindow.document.write(htm);
mywindow.document.close(); // necessary for IE >= 10
mywindow.focus(); // necessary for IE >= 10
mywindow.print();
mywindow.close();
}
这里的主要问题是,背景色或渲染我的自定义打印代码背景css设置为打印对话中的某些元素是不行的,任何想法,帮助,建议,线索?
为什么不包含在HTML文件模板生成一个网址打开一个窗口,并通过查询字符串注入所需的数据? –
是的,那是从我上面的函数实际发生的事情。它会打开一个新窗口并显示打印对话框,我可以在新窗口中看到所有颜色,但不在打印对话框中 –
我试过'-webkit-print-color-adjust:exact; '它的工作原理是跨浏览器? –