javascript 局部页面打印实现代码- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > javascript 局部页面打印实现代码

Javascript: 自己开发Dojo的建议框架; js每次Title显示不同的名言; 不用AJAX和IFRAME,说说真正意义上的ASP+JS无刷新技术; 无限级别的菜单（侧拉菜单）; 点选TOP后并不是直接跳到页顶的，而是滚动上去; js下拉菜单中自动信息轮换播放; 英文首字母全大写的js实现脚本; 实例区别onClick和onDBClick两事件方法; 改变文本框字体颜色的js脚本; js星空效果代码; 判断li是否有样式的js代码; 文本框点击时文字消失，失去焦点时文字出现; 如何让一个层关闭之后，就算刷新页面了也不显示。除非关闭页面再次打开; 右下角弹出窗口效果代码; JS控制对象移动效果; 验证用户是否修改过页面的数据的实现方法; Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]; 正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度; EXT富客户端后台管理系统初步代码; 不同浏览器javascript变量作用域的处理方法

No. « ‹ 110 111 112 113 › »

技术文章搜索

关键字

Javascript 中的 javascript 局部页面打印实现代码

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-12 浏览: 362 ::

收藏到网摘: n/a

ext 代码生成器 Javascript 继承实现例子

Web打印有很多方式，水晶报表使用的恐怕比较多，但这东西是收费软件，老板说不能用:(。 ie自带的有Active控件，但火狐不支持。这里使用的是js操作dom方法对窗体指定标记内文字进行打印，所以使用时需要定义相关的标签及其样式（文字大小、字体之类）。

复制代码代码如下:

<script type="text/javascript"> 
///*********************** 
///打印指定区域页面 
///说明：obj–通过getElementById或其它方式获取标签标识，打印此obj内的文字 
///日期：2009-8-7 
function startPrint(obj) 
{ 
var oWin=window.open("","_blank"); 
var strPrint="<h4 style='font-size:18px; text-align:center;'>打印预览区</h4>\n"; 
strPrint=strPrint + "<script type=\"text/javascript\">\n"; 
strPrint=strPrint + "function printWin()\n"; 
strPrint=strPrint + "{"; 
strPrint=strPrint + "var oWin=window.open(\"\",\"_blank\");\n"; 
strPrint=strPrint + "oWin.document.write(document.getElementById(\"content\").innerHTML);\n"; 
strPrint=strPrint + "oWin.focus();\n"; 
strPrint=strPrint + "oWin.document.close();\n"; 
strPrint=strPrint + "oWin.print()\n"; 
strPrint=strPrint + "oWin.close()\n"; 
strPrint=strPrint + "}\n"; 
strPrint=strPrint + "<\/script>\n"; 
strPrint=strPrint + "<hr size='1′ />\n"; 
strPrint=strPrint + "<div id=\"content\">\n"; 
strPrint=strPrint + obj.innerHTML + "\n"; 
strPrint=strPrint + "</div>\n"; 
strPrint=strPrint + "<hr size='1′ />\n"; 
strPrint=strPrint + "<div style='text-align:center'><button onclick='printWin()' style='padding-left:4px;padding-right:4px;'>打 印</button><button onclick='window.opener=null;window.close();' style='padding-left:4px;padding-right:4px;'>关 闭</button></div>\n"; 
oWin.document.write(strPrint); 
oWin.focus(); 
oWin.document.close(); 
} 
</script> 
<button id="btnPrint" onclick="startPrint(document.getElementById('content'))">打印内容</button> 
<div id="content"> 
<div style="font-size:12px;color:#333;"> 
这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容 
</div> 
</div>

下面是测试代码：

点击运行可以看到效果:

<!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=gb2312" />
<title>打印指定区域页面</title>
<style type="text/css">
body{
font-size:12px;
color:#333;
}
#content{
border:solid 1px #333;
background:#ffc;
}
</style>
<script type="text/javascript">
///***********************
///打印指定区域页面
///说明：obj--通过getElementById或其它方式获取标签标识，打印此obj内的文字
///开发：王洪剑
///日期：2009-8-7
function startPrint(obj)
{ var oWin=window.open("","_blank"); var strPrint="<h4 style='font-size:18px; text-align:center;'>打印预览区</h4>\n"; strPrint=strPrint + "<script type=\"text/javascript\">\n"; strPrint=strPrint + "function printWin()\n"; strPrint=strPrint + "{"; strPrint=strPrint + "var oWin=window.open(\"\",\"_blank\");\n"; strPrint=strPrint + "oWin.document.write(document.getElementById(\"content\").innerHTML);\n"; strPrint=strPrint + "oWin.focus();\n"; strPrint=strPrint + "oWin.document.close();\n"; strPrint=strPrint + "oWin.print()\n"; strPrint=strPrint + "oWin.close()\n"; strPrint=strPrint + "}\n"; strPrint=strPrint + "<\/script>\n"; strPrint=strPrint + "<hr size='1' />\n"; strPrint=strPrint + "<div id=\"content\">\n"; strPrint=strPrint + obj.innerHTML + "\n"; strPrint=strPrint + "</div>\n"; strPrint=strPrint + "<hr size='1' />\n"; strPrint=strPrint + "<div style='text-align:center'><button onclick='printWin()' style='padding-left:4px;padding-right:4px;'>打 印</button><button onclick='window.opener=null;window.close();' style='padding-left:4px;padding-right:4px;'>关 闭</button></div>\n"; oWin.document.write(strPrint); oWin.focus(); oWin.document.close();
}
</script>
</head>
<body>
<button id="btnPrint" onclick="startPrint(document.getElementById('content'))">打印内容</button>
<div id="content"> <div style="font-size:12px;color:#333;"> 这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容这里是打印内容 </div>
</div>
</body>
</html>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

ext 代码生成器 Javascript 继承实现例子

Javascript 中的 javascript 局部页面打印实现代码

评论 (0) All