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
Feb 25 Javascript
动态表格Table类的实现
Aug 26 Javascript
页面只有一个text的时候,回车自动submit的解决方法
Aug 12 Javascript
基于jquery的可多选的下拉列表框
Jul 20 Javascript
js/jquery去掉空格,回车,换行示例代码
Nov 05 Javascript
JS onmousemove鼠标移动坐标接龙DIV效果实例
Dec 16 Javascript
浅谈javascript中自定义模版
Jan 29 Javascript
jQuery与Ajax以及序列化
Feb 01 Javascript
Javascript获取统一管理的提示语(message)
Feb 03 Javascript
easyui tree带checkbox实现单选的简单实例
Nov 07 Javascript
JavaScript的事件机制详解
Jan 17 Javascript
vue中mint-ui的使用方法
Apr 04 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
分享PHP入门的学习方法
2007/01/02 PHP
使用Yii2实现主从数据库设置
2016/11/20 PHP
实例介绍PHP中zip_open()函数用法
2019/02/15 PHP
php设计模式之策略模式实例分析【星际争霸游戏案例】
2020/03/26 PHP
解密效果
2006/06/23 Javascript
在修改准备发的批量美化select+可修改select时,在非IE下发现了几个问题
2007/01/09 Javascript
用dom+xhtml+css制作的一个相册效果代码打包下载
2008/01/24 Javascript
javascript十个最常用的自定义函数(中文版)
2009/09/07 Javascript
JavaScript 输入框内容格式验证代码
2010/02/11 Javascript
JavaScript使用过程中需要注意的地方和一些基本语法
2010/08/26 Javascript
TextArea不支持maxlength的解决办法(jquery)
2011/09/13 Javascript
JavaScript—window对象使用示例
2013/12/09 Javascript
Jquery获取元素的父容器对象示例代码
2014/02/10 Javascript
基于iframe实现类似于ajax的页面无刷新
2014/05/31 Javascript
js实现select组件的选择输入过滤代码
2014/10/14 Javascript
jQuery中append()方法用法实例
2015/01/08 Javascript
判断访客终端类型集锦
2015/06/05 Javascript
javascript中Array()数组函数详解
2015/08/23 Javascript
vue组件watch属性实例讲解
2017/11/07 Javascript
js导出Excel表格超出26位英文字符的解决方法ES6
2017/11/15 Javascript
React 使用browserHistory项目访问404问题解决
2018/06/01 Javascript
vue踩坑记-在项目中安装依赖模块npm install报错
2019/04/02 Javascript
Vue v-for循环之@click点击事件获取元素示例
2019/11/09 Javascript
vue element 中的table动态渲染实现(动态表头)
2019/11/21 Javascript
[02:46]完美世界DOTA2联赛PWL DAY4集锦
2020/11/03 DOTA
Python splitlines使用技巧
2008/09/06 Python
Python编程pygal绘图实例之XY线
2017/12/09 Python
Python 一键制作微信好友图片墙的方法
2019/05/16 Python
学生鉴定评语大全
2014/05/05 职场文书
关于奉献的演讲稿
2014/05/21 职场文书
计生专干事迹
2014/05/28 职场文书
师德自我剖析材料范文
2014/10/06 职场文书
旷课检讨书范文
2014/10/30 职场文书
2014法制宣传日活动总结范文
2014/11/01 职场文书
2015年工程师工作总结
2015/04/30 职场文书
SQL Server作业失败:无法确定所有者是否有服务器访问权限的解决方法
2021/06/30 SQL Server