1

例如,我有一个包含大量文本的页面和一个表格。

我希望用户能够使用“打印此表”javascript 链接仅打印该表,但我仍然希望该页面的其余部分可以通过正常的浏览器打印方法打印。

所以首先我有一个 print.css 样式表,如下所示:

<link type="text/css" rel="stylesheet" href="style/print.css" media="print">

在 print.css 中,我有一个类 '.noPrint' 设置为显示:无。

在我看来,解决方案是使用“tempNoPrint”类将不是表格的内容包装在 div 中,并在单击“打印此表格”时让 javascript 添加“noPrint”到所有带有“tempNoPrint”的 div从而将它们隐藏在打印机版本中。

这很好,我肯定会很好地工作。

但是,在完成表格的打印后,如何从所有 'tempNoPrint' div 中删除 'noPrint' 类?是否有从打印对话框发送的 javascript 回调?我可以使用计时器,但这似乎非常不可靠。

4

2 回答 2

4

这可能是一种核方法,但我之前在遇到此类事情时所做的是将我想要打印的位输出到隐藏的 iframe 并打印出来。

//build new document
var code = "<!doctype html><html><head>";

//add in CSS needed by the table
code += "<link rel='stylesheet' type='text/css' href='table.css' /></head><body>";

//get and add in table code
var code += "<table>"+document.getElementById('some_table').innerHTML+"</table>";

//finish up new doc code
code += "</body></html>";

//write new doc to hidden iframe (name: hiddenFrame)
var doc = hiddenFrame.document.open("text/html","replace");
doc.write(code);
doc.close();

//print
hiddenFrame.print();
于 2012-04-05T10:35:40.023 回答
2

看来我把问题复杂化了!

我用“noPrintCustom”类将我不想打印的页面上的所有内容都包含在按钮 div 中,然后调用此函数:

var printCustom = function() {

    $('.noPrintCustom').addClass('noPrint');
    window.print();
    $('.noPrintCustom').removeClass('noPrint');
}

感谢所有帮助!

于 2012-04-06T07:16:22.790 回答