JavaScript打印网页指定区域的例子


Posted in Javascript onMay 03, 2014

JavaScript打印页面指定div区域原理:使用window.open()在浏览器打开一个新的页面(window), 使用 window.document.write()将指定div区域的内容写入新窗口文档,document.close()关闭文档,使用window.print()调用打印机打印当前文档。

JavaScript打印函数myPrint(obj):

function myPrint(obj){
    //打开一个新窗口newWindow
    var newWindow=window.open("打印窗口","_blank");
    //要打印的div的内容
    var docStr = obj.innerHTML;
    //打印内容写入newWindow文档
    newWindow.document.write(docStr);
    //关闭文档
    newWindow.document.close();
    //调用打印机
    newWindow.print();
    //关闭newWindow页面
    newWindow.close();
}

myprint()调用方法:

myPrint(document.getElementById('printDivID'));

实例代码:

<script>
function myPrint(obj){
    var newWindow=window.open("打印窗口","_blank");
    var docStr = obj.innerHTML;
    newWindow.document.write(docStr);
    newWindow.document.close();
    newWindow.print();
    newWindow.close();
}
</script>
<div id="print">
<hr />
   打印演示区域,点击打印后会在新窗口加载这里的内容!
<hr />
</div>
<button onclick="myPrint(document.getElementById('print'))">打 印</button>
Javascript 相关文章推荐
Javascript - HTML的request类
Jul 15 Javascript
jQuery的显示和隐藏方法与css隐藏的样式对比
Oct 18 Javascript
jQuery前端框架easyui使用Dialog时bug处理
Dec 05 Javascript
基于JavaScript实现定时跳转到指定页面
Jan 01 Javascript
javascript中闭包(Closure)详解
Jan 06 Javascript
jQuery取得iframe中元素的常用方法详解
Jan 14 Javascript
js格式化输入框内金额、银行卡号
Feb 01 Javascript
详解jquery validate实现表单验证 (正则表达式)
Jan 18 Javascript
理解javascript中的Function.prototype.bind的方法
Feb 03 Javascript
Angular.js之作用域scope'@','=','&amp;'实例详解
Feb 28 Javascript
vuex中使用对象展开运算符的示例
Sep 25 Javascript
JS中使用react-tooltip插件实现鼠标悬浮显示框
May 15 Javascript
js检测输入内容全为空格的方法
May 03 #Javascript
JS兼容浏览器的导出Excel(CSV)文件的方法
May 03 #Javascript
离开当前页面前使用js判断条件提示是否要离开页面
May 02 #Javascript
js日期联动示例
May 02 #Javascript
jQuery实现的多选框多级联动插件
May 02 #Javascript
自己使用js/jquery写的一个定制对话框控件
May 02 #Javascript
将form表单中的元素转换成对象的方法适用表单提交
May 02 #Javascript
You might like
php5 mysql分页实例代码
2008/04/10 PHP
PHP中使用BigMap实例
2015/03/30 PHP
PHP在弹框中获取foreach中遍历的id值并传递给地址栏
2017/06/13 PHP
说说掌握JavaScript语言的思想前提想学习js的朋友可以看看
2009/04/01 Javascript
JavaScript定义类的几种方式总结
2014/01/06 Javascript
jQuery分组选择器用法实例
2014/12/23 Javascript
jquery表单验证插件(jquery.validate.js)的3种使用方式
2015/03/28 Javascript
在Javascript操作JSON对象,增加 删除 修改的简单实现
2016/06/02 Javascript
js实现简单的碰壁反弹效果
2016/08/30 Javascript
js判断浏览器是否支持严格模式的方法
2016/10/04 Javascript
Bootstrap和Java分页实例第一篇
2016/12/23 Javascript
JS实现复制功能
2017/03/01 Javascript
js自定义Tab选项卡效果
2017/06/05 Javascript
使用selenium抓取淘宝的商品信息实例
2018/02/06 Javascript
详解Koa中更方便简单发送响应的方式
2018/07/20 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
2018/08/31 Javascript
利用JavaScript的Map提升性能的方法详解
2019/08/14 Javascript
Python解释执行原理分析
2014/08/22 Python
python获取远程图片大小和尺寸的方法
2015/03/26 Python
非递归的输出1-N的全排列实例(推荐)
2017/04/11 Python
详解opencv Python特征检测及K-最近邻匹配
2019/01/21 Python
对python中矩阵相加函数sum()的使用详解
2019/01/28 Python
用python对oracle进行简单性能测试
2020/12/05 Python
Html5游戏开发之乒乓Ping Pong游戏示例(二)
2013/01/21 HTML / CSS
html5借用repeating-linear-gradient实现一把刻度尺(ruler)
2019/09/09 HTML / CSS
英格兰橄榄球商店:England Rugby Store
2016/12/17 全球购物
世界上最大的乐器零售商:Guitar Center
2017/11/07 全球购物
Nice Kicks网上商店:ShopNiceKicks.com
2018/12/25 全球购物
英国领先的体验日提供商:Buyagift
2019/04/19 全球购物
双立人美国官方商店:ZWILLING集团餐具和炊具
2020/05/07 全球购物
优秀医生事迹材料
2014/02/12 职场文书
同学聚会主持词
2014/03/18 职场文书
2014应届本科生自我评价
2014/09/13 职场文书
社保转移委托书范本
2014/10/08 职场文书
工程竣工验收申请报告
2015/05/15 职场文书
2015年安置帮教工作总结
2015/05/22 职场文书