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. [MAT]使用MAT比較多个heap dump文件

    使用MAT比較多个heap dump文件 调试内存泄露时,有时候适时比較2个或多个heap dump文件是非常实用的.这时须要生成多个单独的HPROF文件. 以下是一些关于怎样在MAT里比較多个hea ...

  2. 实习生面试相关-b

    面试要准备什么 有一位小伙伴面试阿里被拒后,面试官给出了这样的评价:“……计算机基础,以及编程基础能力上都有所欠缺……”.但这种笼统的回答并非是我们希望的答案,所谓的基础到底指的是什么? 作为一名 i ...

  3. 李洪强iOS开发之录音和播放实现

    李洪强iOS开发之录音和播放实现 //首先导入框架后,导入头文件.以下内容为托控件,在storyboard中拖出两个按钮为录音和播放按钮 //创建一个UIViewController在.h文件中写 # ...

  4. BestCoder #49 Untitled HDU 5339

    BestCoder #49 Untitled  HDU 5339 题目: http://acm.hdu.edu.cn/showproblem.php? pid=5339 本题採用深搜, 数据量小,先做 ...

  5. Supporting IPv6-only Networks

    Supporting IPv6-only Networks - Support - Apple Developer https://developer.apple.com/support/ipv6/ ...

  6. MYSQL之数据库初窥

    mysql数据库 1.数据库简单介绍    数据库概念:是依照数据结构来组织.存储和管理数据的仓库. 2.经常使用术语    数据库:是一些关联表的集合    数据表:表是数据的矩阵,在数据库中看起来 ...

  7. Swift学习笔记十四:构造(Initialization)

         类和结构体在实例创建时,必须为全部存储型属性设置合适的初始值. 存储型属性的值不能处于一个未知的状态.     你能够在构造器中为存储型属性赋初值,也能够在定义属性时为其设置默认值.下面章节 ...

  8. MVC Web Api 发布到Azure报错

    I fixed this by reinstalling the NuGet package, which corrects broken dependencies. From the package ...

  9. DWR(Direct Web Remoting)是什么

    DWR可以用于改善web页面与Java类交互的远程服务器端Ajax开源框架,可以帮助你开发包含AJAX技术的网站.它可以允许在浏览器里的代码使用运行在WEB服务器上的JAVA函数,就像它就在浏览器里一 ...

  10. bzoj-1192 [HNOI2006]鬼谷子的钱袋(水题)

    题目链接: [HNOI2006]鬼谷子的钱袋 Time Limit: 10 Sec  Memory Limit: 162 MB Description 鬼谷子非常聪明,正因为这样,他非常繁忙,经常有各 ...