JS打印组合功能


Posted in Javascript onAugust 04, 2016

本文为大家分享了JS打印组合功能,功能全面,供大家参考,具体内容如下

1.局部打印--即想打印什么地方就打印什么地方
 解决办法:
 将不想打印的地方隐藏起来
 <style type="text/css" media=print>
.noprint{display : none }
 

分页的时候用 
.PageNext{page-break-after: always;} 
然后给不想打印的页面元素添加: class="Noprint" ,那就不会出现在打印和打印预览中了。
想分页的地方添加:  <div class="PageNext"></div> 就可以了。
</style>
在将不想打印的地方控制起来 
<p class="noprint">不需要打印的地方</p> 

2.引用组建
WebBrowser是IE内置的浏览器控件,无需用户下载. 
WebBrowser控件
<object ID='WebBrowser' WIDTH=0 HEIGHT=0 CLASSID='CLSID:8856F961-340A-11D0-A96B-00C04FD705A2'></object>

关于这个组件的用法,列举如下:
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) 关闭窗体无提示

3.实例

<head>
<script language="javascript"> 
<style type="text/css" media=print>
.noprint{display : none }
</style>
function printsetup()
{ 
 // 打印页面设置 
  wb.execwb(8,1); 
} 
function printpreview(){ 
// 打印页面预览 
wb.execwb(7,1); 
} 
function printit() 
{ 
 if(confirm('确定打印吗?'))
 { 
  wb.execwb(6,6) 
 } 
} 
</script>
</head> 
<body>
<p class="noprint">
<OBJECT classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height="0" id="wb" name="wb" width="0"></OBJECT> 
<input type="button" name="button_print" value="打印" onclick="javascript:printit()" /> 
<input type="button" name="button_setup" value="打印页面设置" onclick="javascript:printsetup();" /> 
<input type="button" name="button_show" value="打印预览" onclick="javascript:printpreview();" /> 
</p>
</body>

3.JS 实现简单的页面局部打印

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); //从开始代码向后取htm
 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)

 4、控制"纵打"、 横打”和“页面的边距。
(1)<script defer>

function SetPrintSettings() { 
 // -- advanced features 
 factory.printing.SetMarginMeasure(2) // measure margins in inches 
 factory.SetPageRange(false, 1, 3) // need pages from 1 to 3 
 factory.printing.printer = "HP DeskJet 870C" 
 factory.printing.copies = 2 
 factory.printing.collate = true 
 factory.printing.paperSize = "A4" 
 factory.printing.paperSource = "Manual feed" 

 // -- basic features 
 factory.printing.header = "This is MeadCo" 
 factory.printing.footer = "Advanced Printing by ScriptX" 
 factory.printing.portrait = false 
 factory.printing.leftMargin = 1.0 
 factory.printing.topMargin = 1.0 
 factory.printing.rightMargin = 1.0 
 factory.printing.bottomMargin = 1.0 
} 
</script> 

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); //从开始代码向后取htm
 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) 

更多关于js打印功能的内容,点击《js打印功能汇总》专题学习

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS中的异常处理方法分享
Dec 22 Javascript
javascript 表格内容排序 简单操作示例代码
Jan 03 Javascript
jquery实现简单的轮换出现效果实例
Jul 23 Javascript
基于Javascript实现文件实时加载进度的方法
Oct 12 Javascript
JS对象是否拥有某属性如何判断
Feb 03 Javascript
JS与HTML结合实现流程进度展示条思路详解
Sep 03 Javascript
layui点击按钮添加可编辑的一行方法
Aug 15 Javascript
微信小程序自定义带价格显示日历效果
Dec 29 Javascript
微信小程序基于picker实现级联菜单
Feb 15 Javascript
解决Layui中templet中a的onclick参数传递的问题
Sep 20 Javascript
微信接入之获取用户头像的方法步骤
Sep 23 Javascript
通过实例了解JS执行上下文运行原理
Jun 17 Javascript
Listloading.js移动端上拉下拉刷新组件
Aug 04 #Javascript
jQuery选择器总结之常用元素查找方法
Aug 04 #Javascript
Bootstrap中表单控件状态(验证状态)
Aug 04 #Javascript
Bootstrap实现input控件失去焦点时验证
Aug 04 #Javascript
html+js+highcharts绘制圆饼图表的简单实例
Aug 04 #Javascript
使用jQuery Ajax 请求webservice来实现更简练的Ajax
Aug 04 #Javascript
JS如何设置cookie有效期为当天24点并弹出欢迎登陆界面
Aug 04 #Javascript
You might like
PHP+MYSQL的文章管理系统(一)
2006/10/09 PHP
PHP和Mysqlweb应用开发核心技术 第1部分 Php基础-3 代码组织和重用2
2011/07/03 PHP
Uncaught exception com_exception with message Failed to create COM object
2012/01/11 PHP
深入PHP autoload机制的详解
2013/06/09 PHP
jQuery+PHP+ajax实现微博加载更多内容列表功能
2014/06/27 PHP
PHP的反射类ReflectionClass、ReflectionMethod使用实例
2014/08/05 PHP
ThinkPHP框架整合微信支付之JSAPI模式图文详解
2019/04/09 PHP
JavaScript 未结束的字符串常量常见解决方法
2010/01/24 Javascript
vs2003 js文件编码问题的解决方法
2010/03/20 Javascript
基于jquery实现的移入页面上空文本框时,让它变为焦点,移出清除焦点
2011/07/26 Javascript
setTimeout函数兼容各主流浏览器运行执行效果实例
2013/06/13 Javascript
纯HTML5制作围住神经猫游戏-附源码下载
2015/08/23 Javascript
Vue.js实现文章评论和回复评论功能
2020/05/30 Javascript
详解Vue组件之间的数据通信实例
2017/06/17 Javascript
微信小程序实现发微博功能的示例代码
2020/06/24 Javascript
python打开url并按指定块读取网页内容的方法
2015/04/29 Python
python 添加用户设置密码并发邮件给root用户
2016/07/25 Python
Linux下多个Python版本安装教程
2018/08/15 Python
Python3 实现串口两进程同时读写
2019/06/12 Python
python实现接口并发测试脚本
2019/06/25 Python
pandas的qcut()方法详解
2019/07/06 Python
Python OpenCV实现鼠标画框效果
2020/08/19 Python
阿姆斯特丹杜莎夫人蜡像馆官方网站:Madame Tussauds Amsterdam
2019/03/12 全球购物
英国领先的独立酒精饮料零售商:DrinkSupermarket
2021/01/13 全球购物
省优秀教师事迹材料
2014/01/30 职场文书
党员公开承诺书
2014/03/25 职场文书
厨师长岗位职责范本
2014/08/25 职场文书
工伤事故赔偿协议书范文
2014/09/24 职场文书
意外死亡赔偿协议书
2014/10/14 职场文书
初中生毕业评语
2014/12/29 职场文书
周年庆典答谢词
2015/01/20 职场文书
刑事起诉书范文
2015/05/19 职场文书
情况说明书怎么写
2015/10/08 职场文书
教师信息技术学习心得体会
2016/01/21 职场文书
蔬果开业典礼发言稿应该怎么写?
2019/09/03 职场文书
Python os和os.path模块详情
2022/04/02 Python