jQuery实现区域打印功能代码详解


Posted in Javascript onJune 17, 2016

使用CSS控制打印样式,需要设置样式media="print",并且将页面中不需要打印的元素的样式display属性设置为none。如DEMO中,我将页头页脚及其他不需要打印的元素的样式设置如下:

<style type="text/css" media="print"> 
#header,.top_title,#jqprint,#footer,#cssprint h3{display:none} 
</style>

用jQuery打印插件printArea.js

$(function(){ 
$("#print_btn").click(function(){ 
$("#my_area").printArea(); 
}); 
});

DEMO中有这样一段代码:

<p><a href="#" id="print_btn">点击这里打印>></a></p> 
<div id="my_area"> 
...打印区域...<br/> 
</div>

当单击打印按钮时,调用件printArea.js插件。该插件还提供了一些参数可配置,使用方法:$(element).printArea(option)。

参数设置:

1、mode:模式,当点击打印按钮时触发模式,默认为iframe,当设置为popup则会新开一个窗口页面打印。

2、popTitle:设置新开窗口的标题,默认为空。

3、popClose:完成打印后是否关闭窗口,默认为false。

PS:IE浏览器打印页面取出页眉页脚网址的方法:文件->页面设置,将页面和页脚的输入框清空即可。

以上所述是小编给大家介绍的jQuery实现区域打印功能代码详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Javascript的闭包
Dec 31 Javascript
ajax与302响应代码测试
Oct 23 Javascript
利用js实现前台动态添加文本框,后台获取文本框内容(示例代码)
Nov 25 Javascript
Javascript堆排序算法详解
Dec 03 Javascript
script标签属性用type还是language
Jan 21 Javascript
分享Javascript实用方法二
Dec 13 Javascript
JS碰撞运动实现方法详解
Dec 15 Javascript
微信小程序 支付功能(前端)的实现
May 24 Javascript
Vue 项目代理设置的优化
Apr 17 Javascript
javascript中一些奇葩的日期换算方法总结
Nov 14 Javascript
vue项目使用高德地图的定位及关键字搜索功能的实例代码(踩坑经验)
Mar 07 Javascript
react使用antd表单赋值,用于修改弹框的操作
Oct 29 Javascript
javascript日期比较方法实例分析
Jun 17 #Javascript
JS实现复制内容到剪贴板功能兼容所有浏览器(推荐)
Jun 17 #Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
Jun 17 #Javascript
JavaScript简单实现弹出拖拽窗口(二)
Jun 17 #Javascript
JS中递归函数
Jun 17 #Javascript
jQuery ajax中使用confirm,确认是否删除的简单实例
Jun 17 #Javascript
JavaScript简单实现弹出拖拽窗口(一)
Jun 17 #Javascript
You might like
PHP提取中文首字母
2008/04/09 PHP
PHP实现加强版加密解密类实例
2015/07/29 PHP
php微信高级接口调用方法(自定义菜单接口、客服接口、二维码)
2016/11/28 PHP
浅谈laravel框架sql中groupBy之后排序的问题
2019/10/17 PHP
DOM下的节点属性和操作小结
2009/05/14 Javascript
按钮JS复制文本框和表格的代码
2011/04/01 Javascript
一个获取第n个元素节点的js函数
2014/09/02 Javascript
纯js模拟div层弹性运动的方法
2015/07/27 Javascript
Javascript实现可旋转的圆圈实例代码
2015/08/04 Javascript
实例代码讲解jquery easyui动态tab页
2015/11/17 Javascript
jquery单击事件和双击事件冲突解决方案
2016/03/02 Javascript
vue拦截器Vue.http.interceptors.push使用详解
2017/04/22 Javascript
JS动态修改网页body的背景色实例代码
2017/10/07 Javascript
解析Angular 2+ 样式绑定方式
2018/01/15 Javascript
angularjs 获取默认选中的单选按钮的value方法
2018/02/28 Javascript
jQuery动态生成的元素绑定事件操作实例分析
2019/05/04 jQuery
JS实现动态添加外部js、css到head标签的方法
2019/06/05 Javascript
基于JavaScript获取base64图片大小
2019/10/18 Javascript
原生js实现碰撞检测
2020/03/12 Javascript
JS script脚本中async和defer区别详解
2020/06/24 Javascript
JavaScript 实现下雪特效的示例代码
2020/09/09 Javascript
Python列表(list)常用操作方法小结
2015/02/02 Python
浅析Python多线程下的变量问题
2015/04/28 Python
python 删除指定时间间隔之前的文件实例
2018/04/24 Python
Python闭包执行时值的传递方式实例分析
2018/06/04 Python
python实现flappy bird小游戏
2018/12/24 Python
python linecache 处理固定格式文本数据的方法
2019/01/08 Python
Python实现深度遍历和广度遍历的方法
2019/01/22 Python
Python+selenium点击网页上指定坐标的实例
2019/07/05 Python
用python获取txt文件中关键字的数量
2020/12/24 Python
美发店5.1活动方案
2014/01/24 职场文书
销售工作决心书
2015/02/04 职场文书
外贸业务员岗位职责
2015/02/13 职场文书
教师师德工作总结2015
2015/07/22 职场文书
自定义函数实现单词排序并运用于PostgreSQL(实现代码)
2021/04/22 PostgreSQL
python程序的组织结构详解
2021/12/06 Python