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声明变量名的语法规则
Jul 10 Javascript
jquery实现叠层3D文字特效代码分享
Aug 21 Javascript
异步加载JS、CSS代码(推荐)
Jun 15 Javascript
jQuery如何封装输入框插件
Aug 19 Javascript
JavaScript函数节流和函数防抖之间的区别
Feb 15 Javascript
jQuery弹出窗口简单实现代码
Mar 09 Javascript
js排序与重组的实例讲解
Aug 28 Javascript
jquery手机触屏滑动拼音字母城市选择器的实例代码
Dec 11 jQuery
jQuery实现的老虎机跑动效果示例
Dec 29 jQuery
Vue-axios-post数据后端接不到问题解决
Jan 09 Javascript
使用Taro实现小程序商城的购物车功能模块的实例代码
Jun 05 Javascript
Vue项目如何引入bootstrap、elementUI、echarts
Nov 26 Vue.js
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/18 PHP
php查找指定目录下指定大小文件的方法
2014/11/28 PHP
php rsa 加密,解密,签名,验签详解
2016/12/06 PHP
PHP符合PSR编程规范的实例分享
2016/12/21 PHP
PHP异常处理定义与使用方法分析
2017/07/25 PHP
Javascript MD4
2006/12/20 Javascript
javascript语句中的CDATA标签的意义
2007/05/09 Javascript
js中将多个语句写成一个语句的两种方法小结
2007/12/08 Javascript
基于jQuery的js分页代码
2010/06/10 Javascript
jQuery源码中的chunker 正则过滤符分析
2012/07/31 Javascript
浏览器打开层自动缓慢展开收缩实例代码
2013/07/04 Javascript
JQuery动画animate的stop方法使用详解
2014/05/09 Javascript
再分享70+免费的jquery 图片滑块效果插件和教程
2014/12/15 Javascript
JavaScript判断undefined类型的正确方法
2015/06/30 Javascript
JavaScript的jQuery库插件的简要开发指南
2015/08/12 Javascript
完美解决手机浏览器顶部下拉出现网页源或刷新的问题
2017/11/30 Javascript
vue中前进刷新、后退缓存用户浏览数据和浏览位置的实例讲解
2018/09/21 Javascript
详解JavaScript作用域和作用域链
2019/03/19 Javascript
微信小程序 Storage更新详解
2019/07/16 Javascript
一篇文章带你浅入webpack的DLL优化打包
2020/02/20 Javascript
[48:44]2014 DOTA2国际邀请赛中国区预选赛5.21 TongFu VS HGT
2014/05/22 DOTA
[01:01:24]LGD vs Fnatic 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
python+mysql实现简单的web程序
2014/09/11 Python
python实现用户登录系统
2016/05/21 Python
详解Python中的Numpy、SciPy、MatPlotLib安装与配置
2017/11/17 Python
Python MySQLdb 使用utf-8 编码插入中文数据问题
2018/03/13 Python
Python3实现取图片中特定的像素替换指定的颜色示例
2019/01/24 Python
Python批量删除只保留最近几天table的代码实例
2019/04/01 Python
Python 寻找局部最高点的实现
2019/12/05 Python
python matplotlib工具栏源码探析二之添加、删除内置工具项的案例
2021/02/25 Python
The Hut德国站点:时装、家居用品、美容等
2016/09/23 全球购物
优秀体育委员自荐书
2014/01/31 职场文书
小学主题班会教案
2015/08/17 职场文书
html+css 实现简易导航栏功能
2021/04/07 HTML / CSS
java中重写父类方法加不加@Override详解
2021/06/21 Java/Android
浅谈css实现背景颜色半透明的两种方法
2021/12/06 HTML / CSS