打印DIV的内容

打印DIV内容的最佳方法是什么?

当前回答

有点晚了，但我发现这真的很好!!

function printDiv(divID) {
    //Get the HTML of div
    var divElements = document.getElementById(divID).innerHTML;
    //Get the HTML of whole page
    var oldPage = document.body.innerHTML;

    //Reset the page's HTML with div's HTML only
    document.body.innerHTML = 
       "<html><head><title></title></head><body>" + 
              divElements + "</body>";

    //Print Page
    window.print();

    //Restore orignal HTML
    document.body.innerHTML = oldPage;
          
}

2021-06-08 00:19:24

其他回答

将Element传递给这个函数打印:

函数printElm(elm) { var orig = document.body.innerHTML; document.body.innerHTML = elm.outerHTML; print (); document.body.innerHTML = origin; ｝

2022-06-25 12:12:42

这应该可以工作:

function printDiv(divName) {
     var printContents = document.getElementById(divName).innerHTML;
     var originalContents = document.body.innerHTML;
     document.body.innerHTML = printContents;
     window.print();
     document.body.innerHTML = originalContents;
}

2021-04-14 13:39:14

注意:这只适用于启用jQuery的站点

这个很酷的技巧非常简单。它在谷歌Chrome浏览器中为我工作。火狐不允许你在没有插件的情况下打印PDF文件。

首先，使用(Ctrl + Shift + I) / (Cmd + Option + I)打开检查器。在控制台中输入以下代码:

var jqchild = document.createElement('script');
jqchild.src = "https://cdnjs.cloudflare.com/ajax/libs/jQuery.print/1.5.1/jQuery.print.min.js";
document.getElementsByTagName('body')[0].appendChild(jqchild);
$("#myDivWithStyles").print(); // Replace ID with yours

它启动打印对话框。打印出来或者保存成PDF格式(chrome)。完成了!

逻辑很简单。我们正在创建一个新的脚本标记，并将其附加在关闭主体标记的前面。我们在HTML中注入了一个jQuery打印扩展。用你自己的Div标签ID更改myDivWithStyles。现在它负责准备一个可打印的虚拟窗口。

在任何网站上尝试一下。唯一需要注意的是，有时巧妙地编写CSS会导致丢失样式。但大多数时候我们得到的是内容。

2017-12-07 10:02:16

最好的方法是将div的内容提交给服务器，并打开一个新窗口，服务器可以将这些内容放入新窗口中。

如果这不是一个选项，你可以尝试使用客户端语言，如javascript隐藏页面上的所有内容，除了div，然后打印页面…

2010-02-12 21:45:48

与最佳答案相同，以防你需要像我一样打印图像:

如果你想打印图像:

function printElem(elem)
    {
        Popup(jQuery(elem).attr('src'));
    }

    function Popup(data) 
    {
        var mywindow = window.open('', 'my div', 'height=400,width=600');
        mywindow.document.write('<html><head><title>my div</title>');
        mywindow.document.write('</head><body >');
        mywindow.document.write('<img src="'+data+'" />');
        mywindow.document.write('</body></html>');

        mywindow.print();
        mywindow.close();

        return true;
    }

2013-10-17 19:38:26

打印DIV的内容

推荐文章

最新文章

标签