利用样式表及javascript自定义函数实现。通过样式表及javascript,实现网页打印,效果也还可以。在此有一个实例请大家看看。下面是打印函数实现详解:
<script language="javascript" type="text/javascript">
<!--
function dp() {
if (window.print)
{
var div1 = document.all.div1.innerhtml;
var div2 = document.all.div2.innerhtml;
// *****************************************************
// div1、div2即为你在打印的区域
// 这里根据你要打印的哪些内容,从原显示页面中用
// <div id=div1>div1....</div><div id=div2>div2...</div>
// 等标示出来,要打印多少项目就标示多少
// ***************************************************** var css = <style type="text/css" media=all> +
p { line-height: 120%} +
.ftitle { line-height: 120%; font-size: 18px; color: #000000} +
td { font-size: 10px; color: #000000} +
</style> ;
// *****************************************************
// 定义打印用的css,具体你想打印出什么样的格式全看你自己
// 了,但要注意:如果此处有什么同网页中不一致的,可能打印
// 出来的页面同网页格式、字体可能会有所不同
// *****************************************************
var body =<table width="640" border="0" cellspacing="0" cellpadding="5"> +
<tr> +
<td class="fbody"> +
<div align="center" class=ftitle> + div1 + </div> + div2 +
</td> +
</tr> +
</table>;
// ******************************************************
// 在此处重新设置的打印格式,根据你的打印要求,将原显示的
// 网页的div内容重新组合,可以根据你原来的表格内容,去掉
// 不要打印的,你也可以能下面定义的noprint忽略掉你不想打
// 印的东西,只调用你要打印的内容,但这样被忽略掉的地方将
// 打印出空,不是很美观。表格宽度要同打印的纸张宽度匹配。
// ******************************************************
document.body.innerhtml = <center> + css + body + </center>;
// ******************************************************
// 重设document.body,打印文档准备就绪
// ******************************************************
window.print();
window.history.go(0);
// ******************************************************
// 调用打印命令,打印当前窗口内容。当你打印时其实是一张新
// 的网页了,但网页文件还是原先的。紧接着调用
// window.history.go(0),再回到打印前的页面,效果相当不差
// ******************************************************
}
}
-->
</script>
<style>
@media print {
.noprint {display:none}
}
</style>
<!--//.noprint 定义了noprint,在以下不需要打印的地方加入 class="noprint"后,用window.print()打印就会忽略-->
好了,一切就绪了,现在要做的就是调用dp函数,如果你将实现调用的按钮设计在同一张网页上,则直接调用即可;如果你用了分帧方法,实现调用的按钮是在另一张网页上,则在dp函数的第一行加入window.focus()命令,否则打印的只是有按钮的网页。
<script language="javascript" type="text/javascript">
<!--
function dp() {
if (window.print)
{
var div1 = document.all.div1.innerhtml;
var div2 = document.all.div2.innerhtml;
// *****************************************************
// div1、div2即为你在打印的区域
// 这里根据你要打印的哪些内容,从原显示页面中用
// <div id=div1>div1....</div><div id=div2>div2...</div>
// 等标示出来,要打印多少项目就标示多少
// ***************************************************** var css = <style type="text/css" media=all> +
p { line-height: 120%} +
.ftitle { line-height: 120%; font-size: 18px; color: #000000} +
td { font-size: 10px; color: #000000} +
</style> ;
// *****************************************************
// 定义打印用的css,具体你想打印出什么样的格式全看你自己
// 了,但要注意:如果此处有什么同网页中不一致的,可能打印
// 出来的页面同网页格式、字体可能会有所不同
// *****************************************************
var body =<table width="640" border="0" cellspacing="0" cellpadding="5"> +
<tr> +
<td class="fbody"> +
<div align="center" class=ftitle> + div1 + </div> + div2 +
</td> +
</tr> +
</table>;
// ******************************************************
// 在此处重新设置的打印格式,根据你的打印要求,将原显示的
// 网页的div内容重新组合,可以根据你原来的表格内容,去掉
// 不要打印的,你也可以能下面定义的noprint忽略掉你不想打
// 印的东西,只调用你要打印的内容,但这样被忽略掉的地方将
// 打印出空,不是很美观。表格宽度要同打印的纸张宽度匹配。
// ******************************************************
document.body.innerhtml = <center> + css + body + </center>;
// ******************************************************
// 重设document.body,打印文档准备就绪
// ******************************************************
window.print();
window.history.go(0);
// ******************************************************
// 调用打印命令,打印当前窗口内容。当你打印时其实是一张新
// 的网页了,但网页文件还是原先的。紧接着调用
// window.history.go(0),再回到打印前的页面,效果相当不差
// ******************************************************
}
}
-->
</script>
<style>
@media print {
.noprint {display:none}
}
</style>
<!--//.noprint 定义了noprint,在以下不需要打印的地方加入 class="noprint"后,用window.print()打印就会忽略-->
好了,一切就绪了,现在要做的就是调用dp函数,如果你将实现调用的按钮设计在同一张网页上,则直接调用即可;如果你用了分帧方法,实现调用的按钮是在另一张网页上,则在dp函数的第一行加入window.focus()命令,否则打印的只是有按钮的网页。