7

在我网站的一个页面上（用 php 编码），我正在尝试添加 2 个（甚至更多）打印按钮，每个按钮打印网页的一部分。例如，在一个页面上有一个包含一些值的表格和下面的 2 个图表。我想添加 2 个打印按钮，一个按钮打印表格，另一个按钮打印两个图表。我找到了这个示例，但无法清楚地理解。任何帮助或示例都会对我有所帮助。

提前致谢。

4

5 回答 5

16

这是 html/javascript 代码，单击时将启动浏览器的打印对话框。

<button onClick="window.print()">Print this page</button>
于 2012-07-24T15:27:47.213 回答
8

如果您的表位于id ='printTable'的div内，请使用：

<a href="#null" onclick="printContent('printTable')">Click to print table</a>

编辑：这是函数“printContent()”

<script type="text/javascript">
<!--
function printContent(id){
str=document.getElementById(id).innerHTML
newwin=window.open('','printwin','left=100,top=100,width=400,height=400')
newwin.document.write('<HTML>\n<HEAD>\n')
newwin.document.write('<TITLE>Print Page</TITLE>\n')
newwin.document.write('<script>\n')
newwin.document.write('function chkstate(){\n')
newwin.document.write('if(document.readyState=="complete"){\n')
newwin.document.write('window.close()\n')
newwin.document.write('}\n')
newwin.document.write('else{\n')
newwin.document.write('setTimeout("chkstate()",2000)\n')
newwin.document.write('}\n')
newwin.document.write('}\n')
newwin.document.write('function print_win(){\n')
newwin.document.write('window.print();\n')
newwin.document.write('chkstate();\n')
newwin.document.write('}\n')
newwin.document.write('<\/script>\n')
newwin.document.write('</HEAD>\n')
newwin.document.write('<BODY onload="print_win()">\n')
newwin.document.write(str)
newwin.document.write('</BODY>\n')
newwin.document.write('</HTML>\n')
newwin.document.close()
}
//-->
</script>
于 2012-07-24T15:39:06.393 回答
6

一个简单的想法是临时创建一些以前的 css 打印规则，例如

.printtable * { display : none; }
.printtable table { display : block; }

和

.printtableandgraph * { display : none; }
.printtableandgraph img { display : block; }

那么这两个按钮应该在语句之前为 body 元素（或其他包含表格和图表的元素）添加一个.printtable和一个类.printtableandgraphwindow.print()

（如果用户在同一个打印按钮上单击两次或更多次，则之前检查元素是否已经设置了该类名）

于 2012-07-24T15:35:49.580 回答
2

打印按钮

<button onClick="window.print()">Print this page</button>`

使用此代码打印任何网页，只有一个回退它的打印所有按钮和菜单栏。

于 2016-03-15T11:44:57.747 回答
0

要打印页面的一部分，您可以使用 print.css 和打印按钮，这是一种快速简单的方法。

  1. 设置 print.css 文件并包括：

     body {visibility:hidden;}
     .print {visibility:visible;}

  1. 将 .print 类添加到页面的适当部分。

  2. 添加按钮：

<button onClick="window.print()">Print this page »</button>

打印结果整洁干净。

于 2018-11-07T17:14:32.647 回答