jquery 网页局部打印总结

最近开发过程中遇到了js局部打印的功能，在网上找相关的资料，最终找到了juery.jqprint-0.3.js

和jquery.PrintArea.js两种。

最初使用的是jquery.jqprint-0.3.js，是在弹窗的情况下使用，即使出现滚动条也依然能够把所有内容成功打印出来。但是如果在当前页面div中出现滚动条(div内容过多,出现垂直滚动条)的话,则内容打印不全。所以最终选择的的是jquery.PrintArea.js。这是我现在发现的最明显的区别。

这两个都是打印指定div内的显示内容。

jquery.PrintArea.js

代码

                                    <script language="javascript" src="jquery-1.7.1.min.js"></script> 
                                
                                    <script type="text/javascript" src="jquery.PrintArea.js"></script> 
                                
                                    $(document).ready(function(){ 
                                
                                        $("#print").click(function(){ 
                                
                                            $(".my_show").printArea(); 
                                
                                        }); 
                                
                                    }); 
                                
                                    <div class="my_show"> 
                                
                                    这个是打印时显示的。 
                                
                                    </div> 
                                
                                    <div class="my_hidden"> 
                                
                                    这个是打印时隐藏的。 
                                
                                    </div> 
                                
                                    <input type="button" id="print"/>

这个插件还提供了一些参数可配置，使用的方法：$（element).printArea(option).
这个方法我自己没有用过，大家尝试，有问题的留言哈。

参数设置：
1.mode：模式，当点击打印按钮时触发模式，默认为iframe，当设置为popup则会新开一个窗口页面打印。
2.popTitle：设置新开窗口的标题，默认为空。
3.popClose：完成打印后是否关闭窗口，默认为false。

jquery.jqprint-0.3.js

代码

                                    <script language="javascript" src="jquery-1.7.1.min.js"></script> 
                                
                                    <script language="javascript" src="jquery.jqprint.js"></script>
                                
                                    <script type="text/javascript"> 
                                
                                        $(document).ready(function() { 
                                
                                            $("#print").click(function(){ 
                                
                                                $(".my_show").jqprint(); 
                                
                                            }) 
                                
                                        }); 
                                
                                    </script> 
                                
                                    <div class="my_show"> 
                                
                                    这个打印时是显示的 
                                
                                    </div> 
                                
                                    <div class="my_hidden"> 
                                
                                    这个打印时是隐藏的。 
                                
                                    </div> 
                                
                                    <input type="button" id="print"/>

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

分类: JAVASCRIPT,Jquery

本文转自左正博客园博客，原文链接：http://www.cnblogs.com/soundcode/p/7448501.html，如需转载请自行联系原作者

jquery 网页局部打印总结相关推荐

js网页打印,js打印,javascript局部打印,网页局部打印方法
一.css控制网页局部打印举例: <div class="noprint" > <table style="margin:0 auto;width:5 ...
jquery.print.js 网页局部打印横向打印去掉页眉页脚
ie-设置(右上角齿轮)-打印-页面设置引入print.css,这个css里存的是自己要打印的区域的样式,比如table,tr,td,边框边距等的样式引入jquery.js和jquery.prin ...
批量打印之jquery局部打印
上个月弄了个批量打印的功能,觉得以后可能用得着,就写个博客记一下,免得忘记了.说这个之前,先来说一下我用过的两个打印插件,一个是Jquery打印插件(这次开始用的),一个是smsx.cab控件的打印插 ...
Jquery生成条形码到网页以及打印条形码
背景最新一个项目上涉及到生成条形码,并打印出来,个人经常写java,但是用后端去处理这个反而挺麻烦的.使用js是比较方便的,这里就简单地介绍一下. 在网上查了很多关于生成条形码的内容,就属JsBar ...
html2canvas实现网页局部存为图片和打印
1.html2canvas.js简介 html2canvas.js具体来说是一个脚本或者js插件, 该脚本允许您直接在用户浏览器上截取网页或部分网页的"内容截图".该脚本是基于DO ...
window.print()打印网页局部内容
用window.print()打印网页局部内容今天客户让添加个打印证照功能,直接用window.print()打印的是整个页面,而用以下方法就可以只打印证明了 <!--window.print ...
html局部可复制,截取网页局部区域css样式的方法和系统的制作方法
截取网页局部区域css样式的方法和系统的制作方法 [技术领域] [0001]本发明涉及计算机网络技术领域,特别是涉及一种截取网页局部区域CSS样式的方法和系统. [背景技术] [0002]CSS(Ca ...
js实现（可实现局部打印）
1.js实现(可实现局部打印) <input id="btnPrint" type="button" value="打印" οncli ...
jQuery之浏览器打印插件
1.jQuery.print.js打印插件地址:https://github.com/DoersGuild/jQuery.print 该打印插件适用于局部打印基础使用方法 $(selector). ...

jquery 网页局部打印总结

jquery 网页局部打印总结相关推荐

最新文章

热门文章