问题 jQuery打印功能用css打印div内容

我的WordPress插件的这个功能使用jQuery从div打印带有“table_disp”类的内容。如何打印css样式。

function pop_print(){
    w=window.open(null, 'Print_Page', 'scrollbars=yes');        
    w.document.write(jQuery('.table_disp').html());
    w.document.close();
    w.print();
}

任何想法？

1206

2017-07-19 18:49

起源

你的意思是$（'＃item'）。css（'color'，'＃999999'）; ？ - Liam Sorsby

我应该使用这样的东西.. w.document.write（jQuery（'。table_disp'）。css（'color'，'＃999999'）。html（））; - Gurjot Bhatti

答案:

您需要在弹出窗口的父页面中包含您正在使用的SAME样式表。您可能想要创建一个包含样式表的虚拟页面存根/包装器，然后注入HTML。

var myStyle = '<link rel="stylesheet" href="http://mysite.com/mystyle.css" />';
w.document.write(myStyle + jQuery('.table_disp').html());

2017-07-19 18:54

你能用一个使用我的函数的例子来详细说明吗？ - Gurjot Bhatti

我已编辑包含此代码。 - Diodeus - James MacFarlane

如果它是一个常规网站可能会有用。由于我正在使用WordPress，因此它不同于将样式表排入队列。如果我喜欢这样，它只会将我重新引导到另一个不存在的页面。 :( - Gurjot Bhatti

function PrintElem(elem) {
    Popup(jQuery(elem).html());
}

function Popup(data) {
    var mywindow = window.open('', 'my div', 'height=400,width=600');
    mywindow.document.write('<html><head><title></title>');
    mywindow.document.write('<link rel="stylesheet" href="http://www.test.com/style.css" type="text/css" />');  
    mywindow.document.write('<style type="text/css">.test { color:red; } </style></head><body>');
    mywindow.document.write(data);
    mywindow.document.write('</body></html>');
    mywindow.document.close();
    mywindow.print();                        
}

<a href="#" id="hrefPrint" onclick="PrintElem('.print_div')">Print</a>

2018-05-08 10:58

如果你可以添加一个插件，那么Jquery printThis插件可以很好地工作（因为你已经在使用jQuery），并且完全符合你的需要。 http://plugins.jquery.com/printThis/

它创建一个iframe并使用你的页面css plus允许一个专门用于打印的附加css文件以及其他东西

2018-02-25 18:47

改为添加样式表

var css= '<link rel="stylesheet" href="/css/print.css" />';
            var printContent = document.getElementById("printContentID");

            var WinPrint = window.open('', '', 'width=900,height=650');
            WinPrint.document.write(printContent.innerHTML);
            WinPrint.document.head.innerHTML = css;
            WinPrint.document.close();
            WinPrint.focus();
            WinPrint.print();
            WinPrint.close();

2017-09-23 06:22

问题 jQuery打印功能用css打印div内容

答案:

热门问题