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 相关文章推荐
jquery 追加tr和删除tr示例代码
Sep 12 Javascript
购物车选中得到价格实现示例
Jan 26 Javascript
21个值得收藏的Javascript技巧
Feb 04 Javascript
js面向对象之静态方法和静态属性实例分析
Jan 10 Javascript
在Ubuntu系统上安装Ghost博客平台的教程
Jun 17 Javascript
JS中的hasOwnProperty()和isPrototypeOf()属性实例详解
Aug 11 Javascript
浅谈vue引入css,less遇到的坑和解决方法
Jan 20 Javascript
React.js绑定this的5种方法(小结)
Jun 05 Javascript
详解webpack模块加载器兼打包工具
Sep 11 Javascript
node(koa2) web应用模块介绍详解
Mar 29 Javascript
vue项目出现页面空白的解决方案
Oct 31 Javascript
一文秒懂JavaScript构造函数、实例、原型对象以及原型链
Aug 25 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下通过file_get_contents的代理使用方法
2011/02/16 PHP
PHP读取ACCESS数据到MYSQL的代码
2011/05/11 PHP
PHP网络操作函数汇总
2015/05/18 PHP
php查询whois信息的方法
2015/06/08 PHP
xml 与javascript结合的问题解决方法
2007/03/24 Javascript
Node.js:Windows7下搭建的Node.js服务(来玩玩服务器端的javascript吧,这可不是前端js插件)
2011/06/27 Javascript
jQuery层次选择器选择元素使用介绍
2013/04/18 Javascript
使用js dom和jquery分别实现简单增删改
2014/09/11 Javascript
分享我的jquery实现下拉菜单心的
2015/11/29 Javascript
解析微信JS-SDK配置授权,实现分享接口
2016/12/09 Javascript
Bootstrap弹出框modal上层的输入框不能获得焦点问题的解决方法
2016/12/13 Javascript
使用react-router4.0实现重定向和404功能的方法
2017/08/28 Javascript
vue+iview写个弹框的示例代码
2017/12/05 Javascript
vue项目优化之通过keep-alive数据缓存的方法
2017/12/11 Javascript
vue.js使用v-model指令实现的数据双向绑定功能示例
2018/05/22 Javascript
Vue在 Nuxt.js 中重定向 404 页面的方法
2019/04/23 Javascript
策略模式实现 Vue 动态表单验证的方法
2019/09/16 Javascript
layer.open组件获取弹出层页面变量、函数的实例
2019/09/25 Javascript
[38:44]DOTA2上海特级锦标赛A组小组赛#2 Secret VS CDEC第二局
2016/02/25 DOTA
Python的Django框架中settings文件的部署建议
2015/05/30 Python
Python实现八大排序算法
2016/08/13 Python
Python中的self用法详解
2019/08/06 Python
Python使用正则实现计算字符串算式
2019/12/29 Python
python无序链表删除重复项的方法
2020/01/17 Python
python matplotlib模块基本图形绘制方法小结【直线,曲线,直方图,饼图等】
2020/04/26 Python
python相对企业语言优势在哪
2020/06/12 Python
浅谈django不使用restframework自定义接口与使用的区别
2020/07/15 Python
Python Tricks 使用 pywinrm 远程控制 Windows 主机的方法
2020/07/21 Python
python的数学算法函数及公式用法
2020/11/18 Python
python 如何读、写、解析CSV文件
2021/03/03 Python
Snapfish英国:在线照片打印和个性化照片礼品
2017/01/13 全球购物
LivingSocial爱尔兰:爱尔兰本地优惠
2018/08/10 全球购物
优秀小学生家长评语
2014/01/30 职场文书
餐饮周年庆活动方案
2014/08/14 职场文书
可怜妈妈观后感
2015/06/09 职场文书
股东出资协议书
2016/03/21 职场文书