js控制web打印(局部打印)方法整理


Posted in Javascript onMay 29, 2013

首先定义css样式:

@media print { 
.noprint { display: none;color:green } 
}

对于不想打印的内容只用在标签中加上 class=noprint即可,打印的时候客户也不会看到页面任何变化。
打印时调用 window.print();

另外几种js局部打印的方法:
移花接木:
打印的时候,把需要打印的内容替换成整个body内容(用户会在打印的时候看到变化,客户体验不太好)

function preview(oper) 
......{ 
if (oper < 10)......{ 
bdhtml=window.document.body.innerHTML;//获取当前页的html代码 
sprnstr="<!--startprint"+oper+"-->";//设置打印开始区域 
eprnstr="<!--endprint"+oper+"-->";//设置打印结束区域 
prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取html 
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html 
window.document.body.innerHTML=prnhtml; 
window.print(); 
window.document.body.innerHTML=bdhtml; 
} else ......{ 
window.print(); 
} 
}

使用很简单 将页面内要打印的内容加入中间<!--startprint1-->XXXXX<!--endprint1-->
再加个打印按纽 onclick=preview(1)
-----------------------------------------
WebBrowser是IE内置的浏览器控件,无需用户下载.(未实验)
一、WebBrowser控件
<object ID='WebBrowser' WIDTH=0 HEIGHT=0 CLASSID='CLSID:8856F961-340A-11D0-A96B-00C04FD705A2'></object>

二、WebBrowder控件的方法
//打印 
WebBrowser1.ExecWB(6,1); 
//打印设置 
WebBrowser1.ExecWB(8,1); 
//打印预览 
WebBrowser1.ExecWB(7,1);

关于这个组件还有其他的用法,列举如下:
WebBrowser.ExecWB(1,1) 打开
Web.ExecWB(2,1) 关闭现在所有的IE窗口,并打开一个新窗口
Web.ExecWB(4,1) 保存网页
Web.ExecWB(6,1) 打印
Web.ExecWB(7,1) 打印预览
Web.ExecWB(8,1) 打印页面设置
Web.ExecWB(10,1) 查看页面属性
Web.ExecWB(15,1) 好像是撤销,有待确认
Web.ExecWB(17,1) 全选
Web.ExecWB(22,1) 刷新
Web.ExecWB(45,1) 关闭窗体无提示
但是打印是会把整个页面都打印出来的,页面里面有什么东西就打印出来,我们有时候只需要打印数据表格,这时我们就要写一个样式了:把不想打印的部份隐藏起来:
样式内容:
<style type="text/css" media=print> 
.noprint......{display : none } 
</style>

然后使用样式就可以:
<p class="noprint">不需要打印的地方</p>
代码如下:
<script language="javascript"> 
function printsetup()......{ 
// 打印页面设置 
wb.execwb(8,1); 
} 
function printpreview()......{ 
// 打印页面预览 
wb.execwb(7,1); 
} 
function printit() 
....{ 
if (confirm('确定打印吗?')) ......{ 
wb.execwb(6,6) 
} 
} 
</script> 
<OBJECT classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height=0 id=wb name=wb width=0></OBJECT> 
<input type=button name=button_print value="打印" class="noprint" onclick="javascript:printit()"> 
<input type=button name=button_setup value="打印页面设置" class="noprint" onclick="javascript:printsetup();"> 
<input type=button name=button_show value="打印预览" class="noprint" onclick="javascript:printpreview();">
Javascript 相关文章推荐
formvalidator验证插件中有关ajax验证问题
Jan 04 Javascript
JS之相等操作符详解
Sep 13 Javascript
jQuery无刷新上传之uploadify简单代码
Jan 17 Javascript
bootstrap weebox 支持ajax的模态弹出框
Feb 23 Javascript
Bootstrap栅格系统简单实现代码
Mar 06 Javascript
基于Vue的文字跑马灯组件(npm 组件包)
May 24 Javascript
javascript 中select框触发事件过程的分析
Aug 01 Javascript
vue-cli中打包图片路径错误的解决方法
Oct 26 Javascript
Angular5.1新功能分享
Dec 21 Javascript
如何使用proxy实现一个简单完整的MVVM库的示例代码
Sep 17 Javascript
使用js和canvas实现时钟效果
Sep 08 Javascript
微信小程序实现加入购物车滑动轨迹
Nov 18 Javascript
js动态为代码着色显示行号
May 29 #Javascript
js判断背景图片是否加载成功使用img的width实现
May 29 #Javascript
jQuery JSON实现无刷新三级联动实例探讨
May 28 #Javascript
jQuery实现随意改变div任意属性的名称和值(部分原生js实现)
May 28 #Javascript
js仿百度有啊通栏展示效果实现代码
May 28 #Javascript
jquery实现商品拖动选择效果代码(自写)
May 28 #Javascript
兼容IE和FF的图片上传前预览js代码
May 28 #Javascript
You might like
Zerg基本策略
2020/03/14 星际争霸
PHP中OpenSSL加密问题整理
2017/12/14 PHP
PHP配合fiddler抓包抓取微信指数小程序数据的实现方法分析
2020/01/02 PHP
php文件上传原理与实现方法详解
2019/12/20 PHP
【消息提示组件】,兼容IE6/7&amp;&amp;FF2
2007/09/04 Javascript
JQuery自定义事件的应用 JQuery最佳实践
2010/08/01 Javascript
function foo的原型与prototype属性解惑
2010/11/19 Javascript
JS判断元素为数字的奇异写法分享
2012/08/01 Javascript
使用js检测浏览器是否支持html5中的video标签的方法
2014/03/12 Javascript
node.js中使用node-schedule实现定时任务实例
2014/06/03 Javascript
JavaScript编程中布尔对象的基本使用
2015/10/25 Javascript
jQuery Easyui使用(一)之可折叠面板的布局手风琴菜单
2016/08/17 Javascript
select隐藏选中值对应的id,显示其它id的简单实现方法
2016/08/25 Javascript
javascript设计模式之Adapter模式【适配器模式】实现方法示例
2017/01/13 Javascript
Vue header组件开发详解
2018/01/26 Javascript
vue中如何实现后台管理系统的权限控制的方法示例
2018/09/19 Javascript
vue 导航锚点_点击平滑滚动,导航栏对应变化详解
2020/08/10 Javascript
javascript实现点击产生随机图形
2021/01/25 Javascript
[01:00:12]2018DOTA2亚洲邀请赛 4.7 淘汰赛 VP vs LGD 第一场
2018/04/09 DOTA
[01:06:18]DOTA2-DPC中国联赛 正赛 Phoenix vs Dynasty BO3 第二场 1月26日
2021/03/11 DOTA
详解Python中DOM方法的动态性
2015/04/11 Python
Python xlrd读取excel日期类型的2种方法
2015/04/28 Python
Python在线运行代码助手
2016/07/15 Python
python实现画五角星和螺旋线的示例
2019/01/20 Python
Python读取Pickle文件信息并计算与当前时间间隔的方法分析
2019/01/30 Python
Python操作PostgreSql数据库的方法(基本的增删改查)
2020/12/29 Python
python实现b站直播自动发送弹幕功能
2021/02/20 Python
TripAdvisor德国:全球领先的旅游网站
2017/12/07 全球购物
周仰杰(JIMMY CHOO)英国官方网站:闻名世界的鞋子品牌
2018/10/28 全球购物
给朋友的道歉信
2014/01/09 职场文书
新闻专业毕业生求职信
2014/08/08 职场文书
2014年实验室工作总结
2014/12/03 职场文书
监察建议书
2015/02/04 职场文书
员工家属慰问信
2015/03/24 职场文书
公司搬迁通知
2015/04/20 职场文书
奠基仪式致辞
2015/07/30 职场文书