欢迎来到奇迪科技(深圳)有限公司,超值服务提供卓越产品!

Html教程

网站制作之设定只打印指定的内容

作者:www.qvdv.com来源:www.qvdv.com更新时间:2013-12-08

    很多时候,我们需要设定打印程序只需打印一个页面的某些内容,而不是全部。这个时候,我们就需要在网站制作,设计页面前框架的时候,就需要考虑好,我们需要打印的内容是这个页面的哪一部分?以下提供两种方案供您参考:

方案一:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>网站制作之设定只打印指定的内容</title>
</head>

<body>
<!--startprint-->
只有这里面的内容会被打印机打印出来
<!--endprint-->
<script>
<!--
function preview() {  

    bdhtml = window.document.body.innerHTML;  

   sprnstr = "<!--startprint-->";  

   eprnstr = "<!--endprint-->";  

    prnhtml = bdhtml.substr(bdhtml.indexOf(sprnstr) + 17);  

    prnhtml = prnhtml.substring(0, prnhtml.indexOf(eprnstr));  

    window.document.body.innerHTML = prnhtml;  

    window.print();  

}  
//-->
</script>
<!--打印按钮-->
<button onClick="preview()">【我要打印】</button>
</body>
</html>


方案2:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>网站制作之设定只打印指定的内容</title>
</head>
<body>
<div id="printCon">
打印的时候,只会打印这里面的内容。
</div>
<!--打印按钮-->
<a href= "javascript:;" onclick= "printPage()">打印 </a> 

<script type="text/javascript" language="javascript"> 
<!--
function  printPage(){ 
  var newWin=window.open('about:blank', '', ''); 
  var titleHTML=document.getElementById("printCon").innerHTML; 
  newWin.document.write(titleHTML); 
  newWin.document.location.reload(); 
  newWin.print(); 
}
//-->
</script>
</body> 
</html>
</body>
</html>


方案一和方案二所实现的功能是一样的。如果您想知道其中却别,可以自己测试一下。

本文版权所有,转载须注明:来源 http://www.qvdv.com/index.php/qvdv-wdl-98.html