局部打印插件 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. hdu5072(鞍山regional problem C):容斥,同色三角形模型

    现场过的第四多的题..当时没什么想法,回来学了下容斥,又听学长讲了一讲,终于把它过了 题目大意:给定n个数,求全部互质或者全部不互质的三元组的个数 先说一下同色三角形模型 n个点 每两个点连一条边(可 ...

  2. 图论:2-SAT模板

    #include<cstdio> #include<vector> #include<cstring> using namespace std; const int ...

  3. css中的列表样式

    在网页设计中,我们经常将某些具有相似功能的标签放在同一组中,这时我们经常会用到列表标签(无序列表ul,有序列表ol),在列表标签中对列表样式的设计可以使我们的页面得到一定程度的美化. 在css中对列表 ...

  4. UVA 1558 - Number Game(博弈dp)

    UVA 1558 - Number Game 题目链接 题意:20之内的数字,每次能够选一个数字,然后它的倍数,还有其它已选数的倍数组合的数都不能再选,谁先不能选数谁就输了,问赢的方法 思路:利用dp ...

  5. Unity发送短信

    闲来无事,觉得用uinity来发送短信挺有意思的,所以自己差了点资料,看看能否实现,结果还真的可以!废话不多说,直接码! 1,新建一空工程,我们就简单的使用UGUI搭建一个丑陋的界面吧! 2,界面极其 ...

  6. .NET基础拾遗(4)委托为何而生?

    生活中的例子: 你早上要吃包子作为早饭,那么你可能让你爸爸或者妈妈帮你做,那你就会调用 爸爸.要包子() 或妈妈.要包子() 返回包子对象. 但是如果你爸妈不在家的时候,你只能去街上买,问题是你根本不 ...

  7. HTML基础知识笔记(三)

    HTML下拉列表框 讲解: 1.value: <option value="House Blend">House Blend</option> 2.sele ...

  8. RouteHttpMap要添加的引用

    System.Web.Routing.RouteCollection' does not contain a definition for 'MapHttpRoute' 此错的解决方式是添加 Syst ...

  9. iOS学习笔记-CoreData

    简介 CoreData提供了对象关系映射(ORM)功能,从效果上说就是创建了一个"虚拟对象数据库",也可以把它看作一个综合的数据库管理库. NSManagedObjectConte ...

  10. Json部分知识(前台显示格式、Json-lib日期处理)

    1,Json格式用于datagrid数据显示 easyui前台显示数据可以使用JSONObject,也可以使用JSONArray.但是如果需要在datagrid表格中进行数据显示,只能使用JSONOb ...