1、首先引用Jquery和jqprint-0.3.js(依赖于Jquery的)

<script language="javascript" src="jquery-1.4.4.min.js">

</script> <script language="javascript" src="jquery.jqprint-0.3.js"></script>

2、Hmtl代码

  1. <div id="print-area">
  2. <table>
  3. <tr>
  4. <td>test</td>
  5. <td>test</td>
  6. <td>test</td>
  7. <td>test</td>
  8. <td>test</td>
  9. </tr>
  10. <tr>
  11. <td>test</td>
  12. <td>test</td>
  13. <td>test</td>
  14. <td>test</td>
  15. <td>test</td>
  16. </tr>
  17. <tr>
  18. <td>test</td>
  19. <td>test</td>
  20. <td>test</td>
  21. <td>test</td>
  22. <td>test</td>
  23. </tr>
  24. <tr>
  25. <td>test</td>
  26. <td>test</td>
  27. <td>test</td>
  28. <td>test</td>
  29. <td>test</td>
  30. </tr>
  31. <tr>
  32. <td>test</td>
  33. <td>test</td>
  34. <td>test</td>
  35. <td>test</td>
  36. <td>test</td>
  37. </tr>
  38. </table>
  39. </div>
  40. <input type="button" onclick=" print()" value="打印">

3、JavaScript代码

  1. <script language="javascript">
  2. function print(){
  3. $("#print-area").jqprint({
  4. debug: false,
  5. importCSS: true,
  6. printContainer: true,
  7. operaSupport: false
  8. });
  9. }
  10. </script>

4、属性

  • debug: false, //如果是true则可以显示iframe查看效果(iframe默认高和宽都很小,可以再源码中调大),默认是false
  • importCSS: true, //true表示引进原来的页面的css,默认是true。(如果是true,先会找$("link[media=print]"),若没有会去找$("link")中的css文件)
  • printContainer: true, //表示如果原来选择的对象必须被纳入打印(注意:设置为false可能会打破你的CSS规则)。
  • operaSupport: false //表示如果插件也必须支持歌opera浏览器,在这种情况下,它提供了建立一个临时的打印选项卡。默认是true

5、特殊打印样式

如果在打印时需要独特的css样式,除了可以直接写在style属性内还可以通过

  <link href="printStyle.css" rel="stylesheet"type="text/css" media="print">

  来引用外部css文件中的样式。这样的好处是该样式只会在打印时才应用。

Jquery插件jqprint-0.3.js实现打印的更多相关文章

  1. 自写图片遮罩层放大功能jquery插件源代码,photobox.js 1.0版,不兼容IE6

    阿嚏~~~ 话说本屌丝没啥开发插件的经验,可是天公不作美,公司须要让我自己开发个图片放大的插件 但公司老大的话,宛如吾皇之圣旨,微臣必当肝脑涂地,莫敢不从啊~~~ 于是乎,作为一个超级小白,本人仅仅能 ...

  2. jQuery插件EasyDrag轻松实现JS拖动的效果

    jquery.easydrag下载地址:http://ishare.iask.sina.com.cn/f/34289681.html 实现效果图:分布实现一.页面Html标签元素定义 <!doc ...

  3. html select美化模拟jquery插件select2.js

    代码展示:http://www.51xuediannao.com/demo.php 代码说明: select2.js是一个html select美化模拟类jquery插件,但是select2.js又远 ...

  4. 【转】2014年25款最好的jQuery插件

    2014年25款最好的jQuery插件 来源:Specs' Blog-就爱PHP   时间:2014-12-30 10:24:10   阅读数:2267 分享到: 0 http://www.php10 ...

  5. 全屏滚动-jQuery插件实现

    全屏滚动 <---很久没写了,这段忙了点,以后还是每周尽量写点东西---> 在很多情况下,我们需要页面的全屏滚动,尤其是移动端.今天简要的介绍一下全屏滚动的知识. 一.全屏滚动的原理 1. ...

  6. jquery插件实现鼠标经过图片右侧显示大图的效果(类似淘宝)

    这个插件的名字elevatezoom,网址为http://www.elevateweb.co.uk/image-zoom,在github上的项目首页为https://github.com/elevat ...

  7. 16款创建CSS3动画的jQuery插件

    jQuery插件是用来扩展jQuery原型对象的方法. 本文搜集了用来为你的站点创建CSS3动画的一些jQuery插件. 1. jQuery Smoove Smoove 简化了CSS3转换效果.使得页 ...

  8. JS原生ajax与Jquery插件ajax深入学习

    序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...

  9. 如何将Js代码封装成Jquery插件

    很多相同的Jquery代码会在很多页面使用,每次都复制粘贴太麻烦了,不如封装成一个Jquery插件就方便了,至于影响网页的速度不,我就没有测试了哈. 代码如下 这是一个自定闪烁打印文字的Jquery特 ...

  10. 最简单的原生js和jquery插件封装

    最近在开发过程中用别人的插件有问题,所以研究了一下,怎么封装自己的插件. 如果是制作jquery插件的话.就将下面的extend方法换成  $.extend 方法,其他都一样. 总结一下实现原理: 将 ...

随机推荐

  1. BZOJ 1005 明明的烦恼 Prufer序列+组合数学+高精度

    题目大意:给定一棵n个节点的树的节点的度数.当中一些度数无限制,求能够生成多少种树 Prufer序列 把一棵树进行下面操作: 1.找到编号最小的叶节点.删除这个节点,然后与这个叶节点相连的点计入序列 ...

  2. MySQL存储结构的使用

    前言 今天公司老大让我做一个MySQL的调研工作,是关于MySQL的存储结构的使用.这里我会通过3个样例来介绍一下MySQL中存储结构的使用过程,以及一些须要注意的点. 笔者环境 系统:Windows ...

  3. 2016/3/21 面向对象: ①定义类 ②实例化对象 ③$this关键字 ④构造函数 ⑤析构函数 ⑥封装 ⑦继承

    一:定义类   二:实例化对象 //定义类 class Ren { var $name; var $sex; var $age; function Say() { echo "{$this- ...

  4. myeclipse.hbm.xml自动生成

    第一,你的项目是否搭建了hibernate框架? 第二,你是否建立了相应的数据表: 第三,做好前两步,你再把myeclipse和数据库连接起来,在相应的表上点击右键,生成hibernate 关联文件就 ...

  5. 关于maven pom

    1 maven pom.xml只是配置文件 构建的流程已经固化在maven中了,pom.xml只是对这个流程的配置.特别是插件,在不进行人工绑定的情况下,插件是对应固定的生命周期的,我们操作的时候是操 ...

  6. css中vertical-align和line-height的用法

    css中vertical-align和line-height的用法 1.先来看一种现象: (1).将一个图片放入一个div块中,div块背景颜色设置为aquamarine.将会发现图片与div块下边沿 ...

  7. #啃underscore源码 一、root对象初始化部分

    最近由于比赛要交了,以及工作室屯了各种项目,实在忙不过来刷题,所以很久没更blog了(良心痛),现在自己的水平还是渣代码堆砌 + 简单的增删改查(悲伤) 所以痛定思痛,决定之后的任务是先补学校课堂的知 ...

  8. Servlet8

    一.Annotation 进行配置不需要 web.xml 新建new Servlet 时,不需要在web.xml 文件中生成Servlet的相关信息 import java.io.IOExceptio ...

  9. CodeForces-652D:Nested Segments(树状数组+离散化)

    You are given n segments on a line. There are no ends of some segments that coincide. For each segme ...

  10. 记重大失误(SQLserver数据回滚)ApexSQL

    敲了一天代码,脑壳昏,更改数据时忘记加where条件,该数据库又未备份.修改了1800条数据..当时那个着急啊. 各种找解决方法,最后使用ApexSQL Log  完美解决.赞一个 ApexSQL L ...