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. 基于编程人员Python学习第一章节

    基于廖雪峰的python零基础学习后,自我总结.适用于有一定基础的编程人员,对我而言,则是基于.net已有方面,通过学习,记录自我觉得有用的地方,便于后续回顾. 主要以快速定位内容,通过直观代码输入输 ...

  2. Python中字符运算的优先级

    表1-2 运算符优先级 运算符 描述 lambda Lambda表达式 or 布尔“或” and 布尔“与” not x 布尔“非” in,not in 成员测试 is,is not 同一性测试 &l ...

  3. oracle随机数

    1.从表中随机取记录 select * from (select * from staff order by dbms_random.random) where rownum < 4 表示从ST ...

  4. HDU 4277 USACO ORZ(暴力+双向枚举)

    USACO ORZ Time Limit: 5000/1500 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total ...

  5. POJ之01背包系列

    poj3624 Charm Bracelet 模板题 没有要求填满,所以初始化为0就行 #include<cstdio> #include<iostream> using na ...

  6. is id() == 从内存的最小化占用角度解释 我是孕育者,我也应该这样设计 变,必然伴随着加法 一个list是否可以执行set()

    def f(a, b): print(a is b, b is a, a == b, a.__eq__(b), id(a), id(b)) f(2, 2) f([2], [2]) f('2', '2' ...

  7. HTTP要点概述:四,HTTP方法

    使用HTTP协议的时候,客户端可以通过HTTP方法告知服务器自己请求的意图. 看了这篇文章以后,谁再说HTTP方法只有GET和POST,你的眼睛是用来吃饭的嘛! 一,GET:获取资源 GET用来请求访 ...

  8. create database 默认utf-8

    CREATE DATABASE IF NOT EXISTS dbname DEFAULT CHARSET utf8 COLLATE utf8_general_ci; 这是sql语句 CREATE TA ...

  9. javascript 二级联动

    <html> <head> <title></title> <meta http-equiv="Content-Type" c ...

  10. apktool工具下载地址

    apktool工具下载地址 http://ibotpeaches.github.io/Apktool/