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 相关文章推荐
用jquery和json从后台获得数据集的代码
Nov 07 Javascript
Google Map V3 绑定气泡窗口(infowindow)Dom事件实现代码
Apr 26 Javascript
jQuery+easyui中的combobox实现下拉框特效
Feb 27 Javascript
jQuery选择器源码解读(三):tokenize方法
Mar 31 Javascript
手机Web APP如何实现分享多平台功能
Aug 19 Javascript
jQuery实现侧浮窗与中浮窗切换效果的方法
Sep 05 Javascript
web前端开发upload上传头像js示例代码
Oct 22 Javascript
详解堆的javascript实现方法
Nov 29 Javascript
获取JavaScript异步函数的返回值
Dec 21 Javascript
vue中选项卡点击切换且能滑动切换功能的实现代码
Nov 25 Javascript
vue中多个倒计时实现代码实例
Mar 27 Javascript
js在HTML的三种引用方式详解
Aug 29 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
第五节--克隆
2006/11/16 PHP
PHP session_start()问题解疑(详细介绍)
2013/07/05 PHP
PHP中“=&gt;
2019/03/01 PHP
Laravel框架控制器的middleware中间件用法分析
2019/09/30 PHP
php和js实现根据子网掩码和ip计算子网功能示例
2019/11/09 PHP
jQuery)扩展jQuery系列之一 模拟alert,confirm(一)
2010/12/04 Javascript
无缝滚动改进版支持上下左右滚动(封装成函数)
2012/12/04 Javascript
JavaScript中的noscript元素属性位置及作用介绍
2013/04/11 Javascript
JS获取DropDownList的value值与text值的示例代码
2014/01/07 Javascript
浅谈nodeName,nodeValue,nodeType,typeof 的区别
2015/01/13 Javascript
Javascript对象Clone实例分析
2015/06/09 Javascript
jquery 中ajax执行的优先级
2015/06/22 Javascript
js删除数组元素、清空数组的简单方法(必看)
2016/07/27 Javascript
JavaScript中利用Array filter() 方法压缩稀疏数组
2018/02/24 Javascript
微信小程序自定义导航教程(兼容各种手机)
2018/12/12 Javascript
微信小程序代码上传、审核发布小程序
2019/05/18 Javascript
js+springMVC 提交数组数据到后台的实例
2019/09/21 Javascript
浅谈vue项目,访问路径#号的问题
2020/08/14 Javascript
[02:27]2018DOTA2亚洲邀请赛趣味视频之钓鱼大赛 谁是垂钓冠军?
2018/04/05 DOTA
Python中django学习心得
2017/12/06 Python
强悍的Python读取大文件的解决方案
2019/02/16 Python
python读取文件指定行内容实例讲解
2020/03/02 Python
keras 简单 lstm实例(基于one-hot编码)
2020/07/02 Python
python如何修改文件时间属性
2021/02/05 Python
HTML5 移动页面自适应手机屏幕四类方法总结
2017/08/17 HTML / CSS
html5视频媒体标签video的使用方法及完整参数说明详解
2019/09/27 HTML / CSS
Snapfish爱尔兰:在线照片打印和个性化照片礼品
2018/09/17 全球购物
毕业生护理专业个人求职信范文
2014/01/04 职场文书
新年爱情寄语
2014/04/08 职场文书
安全生产责任书范本
2014/04/15 职场文书
交通事故调解协议书
2014/04/16 职场文书
党员先进性教育整改措施
2014/09/18 职场文书
领导班子整改措施
2014/10/24 职场文书
2014保险公司个人工作总结
2014/12/09 职场文书
三十年再续同学情倡议书
2019/11/27 职场文书
《卧薪尝胆》读后感3篇
2019/12/26 职场文书