Question

如何打印具有相同ID的多个div，因为我正在循环div并且它始终保留id=PrintArea。

我正在使用PrintArea来打印我的div。

和这个JS：

function printDiv() {
           var divToPrint = document.getElementById('printArea');
           newWin= window.open();
           newWin.document.write(divToPrint.innerHTML);
           newWin.location.reload();
           newWin.focus();
           newWin.print();
           newWin.close();
       }

Answer 1

为要打印的div提供类名，然后是循环：

var divsToPrint = document.getElementsByClassName('printArea'), n;

for (n = 0; n < divsToPrint.length; n++) {
    printDiv(divsToPrint[n]);
}

function printDiv(div) {
    var newWin= window.open('', 'win');
    newWin.document.write(div.innerHTML);
    newWin.location.reload();
    newWin.focus();
    newWin.print();
    newWin.close();
}

另请访问MDN，了解window.open()的调用方式。

但是，如果您使用带有media="print"属性的样式表，则会更简单。在此样式表中，应该有三个类：.noprint {display: none;}表示要打印的所有内容，.printable {display: none;}表示要打印的div，.print {display: block;}表示切换为.printable ，实际打印时。

Answer 2

要一起打印多个div内容

function printMultipleDiv()
{
    var divsToPrint = document.getElementsByClassName('printArea');
    var printContents = "";
    for (n = 0; n < divsToPrint.length; n++) 
    {
       printContents += divsToPrint[n].innerHTML+"<br>";
    }
    var originalContents = document.body.innerHTML;
    document.body.innerHTML = printContents;
    window.print();
    document.body.innerHTML = originalContents;
}

多个div打印

2 个答案: