局部打印插件 jquery.PrintArea.js

js代码


(function ($) {
    var printAreaCount = 0;
    $.fn.printArea = function () {
        var ele = $(this);
        var idPrefix = "printArea_";
        removePrintArea(idPrefix + printAreaCount);
        printAreaCount++;
        var iframeId = idPrefix + printAreaCount;
        var iframeStyle = 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;';
        iframe = document.createElement('IFRAME');
        $(iframe).attr({
            style: iframeStyle,
            id: iframeId
        });
        document.body.appendChild(iframe);
        var doc = iframe.contentWindow.document;
        $(document).find("link").filter(function () {
            return $(this).attr("rel").toLowerCase() == "stylesheet";
        }).each(
                function () {
                    doc.write('<link type="text/css" rel="stylesheet" href="'
                            + $(this).attr("href") + '" >');
                });
        doc.write('<div class="' + $(ele).attr("class") + '">' + $(ele).html()
                + '</div>');
        doc.close();
        var frameWindow = iframe.contentWindow;
        frameWindow.close();
        frameWindow.focus();
        frameWindow.print();
    }
    var removePrintArea = function (id) {
        $("iframe#" + id).remove();
    };
})(jQuery);

使用示例:


<input type="button" id="btnPrint" value="打印"/>
<div id="printContent">要打印的内容区域<div> <script type="text/javascript">
$(function(){
        $("#btnPrint").click(function(){ $("#printContent").printArea(); });
});
</script>

Jquery局部打印插件的更多相关文章

  1. jquery局部打印插件使用

    基于jquery库的jquery.PrintArea.js插件源代码为: (function ($) { var printAreaCount = 0; $.fn.printArea = functi ...

  2. jq局部打印插件jQuery.print.js(兼容IE8)

    /* @license * jQuery.print, version 1.5.1 * (c) Sathvik Ponangi, Doers' Guild * Licence: CC-By (http ...

  3. 局部打印插件 jquery.PrintArea.js

    (function ($) { var printAreaCount = 0; $.fn.printArea = function () { var ele = $(this); var idPref ...

  4. 运用jquery做打印和导出操作

    我最近接手的项目中经常让做出打印和导出统计图和表格 首先说打印,打印如果用echarts做出来的图表,打印的时候,要借助jquery的打印插件. 打印插件: <script src=" ...

  5. jquery 网页局部打印总结

    最近开发过程中遇到了js局部打印的功能,在网上找相关的资料,最终找到了juery.jqprint-0.3.js 和jquery.PrintArea.js两种. 最初使用的是jquery.jqprint ...

  6. jQuery简单易用的网页内容打印插件

    简要教程 jQuery.print是一款简单易容且功能强大的网页内容打印jQuery插件.该网页打印插件可以打印指定区域的网页元素,可以指定跳过不打印某些元素,还可以打印整个页面内容.并且提供了丰富的 ...

  7. asp.net 实现在线打印功能,jQuery打印插件PrintArea实现自动分页

    使用的组件:jQuery打印插件PrintArea,有兴趣的可以研究一下. 使用方法略过,这里将介绍如何实现打印多页是可以分页. 现在提供两种方法思路: 1.根据特定的打印机型号和使用的纸张类型,然后 ...

  8. jQuery-jqprint.js打印插件使用高版本jQuery时问题

    使用jqprint打印插件的网页demo代码: <!doctype html> <html> <head> <meta charset="utf-8 ...

  9. js或jquery实现页面打印(局部打印)

    首先定义css样式:  复制代码代码如下: @media print { .noprint { display: none;color:green } }  对于不想打印的内容只用在标签中加上 cla ...

随机推荐

  1. 黑马程序员_Java面向对象1_封装

    3.面向对象_封装 3.1面向对象概念 3.1.1理解面向对象 面向对象是相对面向过程而言 面向对象和面向过程都是一种思想 面向过程:强调的是功能行为(执行者) 面向对象:将功能封装进对象,强调具备了 ...

  2. 在ubuntu14.04上部署hadoop2.6.3

    一.在Ubuntu下创建hadoop组和hadoop用户 增加hadoop用户组,同时在该组里增加hadoop用户,后续在涉及到hadoop操作时,我们使用该用户. 1.创建hadoop用户组 2.创 ...

  3. 图片实时预览JSP加js

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. maven plugin在tomcat 热部署

    前言: 此处的方法适用于tomcat6 和 tomcat7,对于最新的tomcat8还没有进行过測试,有兴趣的同学能够自己測一下. 总共分为五步:         1.在tomcat中配置用户权限,即 ...

  5. Ubuntu 14.04根据系统,休眠后不能启动要解决的问题

    简介: 提升Ubuntu制度14.04之后,当系统进入休眠,我们不能再次启动,直接崩溃,凡出了问题? 1.   问题纳入 Ubuntu升级系统14.04之后.通过系统的Power设置休眠时间,在系统进 ...

  6. 寒哥细谈之AutoLayout全解

    文/南栀倾寒(简书作者)原文链接:http://www.jianshu.com/p/683fbcbfb705著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 看到群中好多朋友还停留在Fr ...

  7. c++ 11 多线程教学(1)

    本篇教学代码可在GitHub获得:https://github.com/sol-prog/threads. 在之前的教学中,我展示了一些最新进的C++11语言内容: 1. 正则表达式(http://s ...

  8. HTML与CSS入门——第十章 创建用于Web上的图像

    知识点: 1.选择图像软件的方法 2.准备用于网上的照片的方法 3.创建标题和按钮的方法 4.减少图像中颜色数量的方法 5.创建透明图像的方法 6.创建平铺背景的方法 7.创建Web动画的方法 10. ...

  9. ASP.NET优化性能方法之一禁用调试模式(转)

    若要设置 ASP.NET 应用程序的调试模式,必须编辑应用程序的 Web.config 配置文件. 通常,ASP.NET 应用程序的 Web.config 文件与应用程序位于相同的 URL 位置上. ...

  10. SQL Server 2005中的分区表(三):将普通表转换成分区表

    在设计数据库时,经常没有考虑到表分区的问题,往往在数据表承重的负担越来越重时,才会考虑到分区方式,这时,就涉及到如何将普通表转换成分区表的问题了. 那么,如何将一个普通表转换成一个分区表 呢?说到底, ...