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 相关文章推荐
Js 时间间隔计算的函数(间隔天数)
Nov 15 Javascript
让AJAX不依赖后端接口实现方案
Dec 03 Javascript
Javascript页面添加到收藏夹的简单方法
Aug 07 Javascript
jQuery 回车事件enter使用示例
Feb 18 Javascript
JavaScript实现广告的关闭与显示效果实例
Jul 02 Javascript
AngularJS指令中的绑定策略实例分析
Dec 14 Javascript
JS中微信小程序自定义底部弹出框
Dec 22 Javascript
使用iView Upload 组件实现手动上传图片的示例代码
Oct 01 Javascript
vue中的适配px2rem示例代码
Nov 19 Javascript
微信小程序获取当前位置和城市名
Nov 13 Javascript
vue+animation实现翻页动画
Jun 29 Javascript
封装 axios+promise通用请求函数操作
Aug 11 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
php中static静态变量的使用方法详解
2010/06/04 PHP
thinkPHP中分页用法实例分析
2015/12/26 PHP
php版微信自定义回复功能示例
2016/12/05 PHP
laravel框架中间件 except 和 only 的用法示例
2019/07/12 PHP
用js模拟JQuery的show与hide动画函数代码
2010/09/20 Javascript
window.location.hash 使用说明
2010/11/08 Javascript
检测input每次的输入是否合法遇到汉字输入就有问题
2012/05/23 Javascript
jquery解决图片路径不存在执行替换路径
2013/02/06 Javascript
JavaScript的漂亮的代码片段
2013/06/05 Javascript
JS获得QQ号码的昵称,头像,生日的简单实例
2013/12/04 Javascript
jquery获取table指定行和列的数据方法(当前选中行、列)
2016/11/07 Javascript
js实现登录验证码
2016/12/22 Javascript
JS给按钮添加跳转功能类似a标签
2017/05/30 Javascript
vue路由跳转传参数的方法
2019/05/06 Javascript
Node.js控制台彩色输出的方法与原理实例详解
2019/12/01 Javascript
js 图片懒加载的实现
2020/10/21 Javascript
[00:36]DOTA2上海特级锦标赛 LGD战队宣传片
2016/03/04 DOTA
python write无法写入文件的解决方法
2019/01/23 Python
Python分割训练集和测试集的方法示例
2019/09/19 Python
Win10下python 2.7与python 3.7双环境安装教程图解
2019/10/12 Python
详解python中的lambda与sorted函数
2020/09/04 Python
Python并发爬虫常用实现方法解析
2020/11/19 Python
Python实现Word文档转换Markdown的示例
2020/12/22 Python
CSS3中31种选择器使用方法教程
2013/12/05 HTML / CSS
澳大利亚潮流尖端的快时尚品牌:Cotton On
2016/09/26 全球购物
伦敦剧院门票:From The Box Office
2018/06/30 全球购物
Yankee Candle官网:美国最畅销蜡烛品牌之一
2020/01/05 全球购物
人事部主管岗位职责
2013/12/26 职场文书
公司企业表扬信
2014/01/11 职场文书
行政文秘岗位职责范本
2014/02/10 职场文书
低碳生活的宣传标语
2014/06/23 职场文书
2014年最新大专生职业生涯规划书范文
2014/09/13 职场文书
公司放假通知范文
2015/04/14 职场文书
资金申请报告范文
2015/05/14 职场文书
防卫过当辩护词
2015/05/21 职场文书
Python使用OpenCV实现虚拟缩放效果
2022/02/28 Python