你的位置:首页 > Java教程

[Java教程]如何点击一个按钮实现打印


如何点击一个按钮实现打印:
很多网站在底部都有一个打印按钮,点击此按钮就可以实现打印效果,代码非常的简单。

 

<a href="javascript:window.print()">蚂蚁部落</a>

 

也就是只要调用window.print()函数就可以实现打印当前页面。
但是上面的并不完美,因为有些网页上的很多内容都不需要打印,下面介绍一下如何打印页面中的指定内容。
代码如下:

 

<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>指定被打印的内容-蚂蚁部落</title><script language="javascript"> function printdiv(printpage) {  var newstr = printpage.innerHTML;  var oldstr = document.body.innerHTML;  document.body.innerHTML =newstr;  window.print();  document.body.innerHTML=oldstr;  return false; } window.onload=function(){ var bt=document.getElementById("bt"); var div_print=document.getElementById("div_print");   bt.onclick=function() { printdiv(div_print); }}</script> </head> <body> <div id="div_print">  <h1 style="Color:Red">这是要被打印的内容</h1> </div><div style="Color:Red">蚂蚁部落欢迎您</div> <input name="print" type="button" id="bt" value="点击打印" /> </body> </html> 

 

特别说明:打印预览需要将代码复制到本机测试,否则会出错。
以上代码实现了打印网页指定内容的效果,下面简单介绍一下实现过程。
一.实现原理:
在js代码中使用document.body.innerHTML =newstr,动态原来body中的内容替换为要打印的内容,在打印过后,在将原来的内容还原,原理就是这么简单,具体可以参阅代码注释。
二.代码注释:
1.function printdiv(printpage){},声明一个控制打印的函数,参数是一个对象,这个对象中的内容将要被打印。
2.var newstr = printpage.innerHTML; ,获取要打印的内容。
3.var oldstr = document.body.innerHTML,原来body中的内容。
4. document.body.innerHTML =newstr,用将要打印的内容替换原来body中的内容。
5.window.print(),开始打印。
6.document.body.innerHTML=oldstr,再将原来body中的内容还原。
三.相关阅读:
1.window.print()函数可以参阅window对象的print()方法一章节。
2.onclick事件可以参阅javascript的onclick事件一章节。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=9179

更多内容可以参阅:http://www.softwhy.com/javascript/