关于使用jqprint 打印以及打印没有样式问题

最新推荐文章于 2026-04-23 10:39:55 发布
原创 最新推荐文章于 2026-04-23 10:39:55 发布 · 1.2w 阅读 · 1 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文介绍如何利用jQuery.jqprint插件实现网页内容的实时打印功能，包括插件的引入、使用方法及如何添加样式。通过简单的代码示例，读者可以快速掌握并应用到自己的项目中。

不多说 先要引入插件

<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="./js/jquery.jqprint-0.3.js"></script>

插件的使用

#print是你要打印区域的盒子
        function print() {
           $("#print").jqprint({
              debug: false,  //是否显示iframe查看效果
              importCSS: true,
              printContainer: true,
              operaSupport: false
           });
        }

打印没有样式加上这句就可以了

    <link rel="stylesheet" type="text/css" media="screen,print" href="css/print.css" />
 

【Vue】Vue 使用 Print.js 打印选中区域的html，用到的是Element ui table表格，解决页面样式不出现或者table表格样式错乱问题！！！
蓝胖子的博客
02-24 1万+
【Vue】Vue 使用 Print.js 打印选中区域的html，用到的是Element ui table表格，解决页面样式不出现或者table表格样式错乱问题！！！
Arm CCA与CAEC：机密计算中的高效跨虚拟机通信
最新发布
weixin_30883311的博客
04-23 686
机密计算通过硬件级隔离技术（如Arm CCA的领域世界）保护敏感数据，成为云安全和边缘计算的关键支撑。其核心原理是在CPU特权级（如EL3）运行可信固件（RMM），配合颗粒保护表（GPT）实现内存隔离。这种技术显著提升了分布式机器学习、微服务架构等场景的安全性，但传统跨虚拟机通信存在加密开销大、内存冗余等问题。CAEC系统创新性地扩展Arm CCA固件，通过机密共享内存（CSM）机制实现认证式零拷贝通信，实测显示其延迟降低209倍，吞吐量接近理论内存带宽。该方案特别适用于需要高频跨VM数据交换的AI推理、边
element ui 组件打印时丢失样式的解决办法
yueping0718的专栏
07-28 2901
当vue前端使用打印插件时（比如vue-print-nb）,偶尔会碰到无法打印出组件样式的情况，比如复选框el-checkbox。找到对应的组件样式，比如复选框el-checkbox,找到.el_checkbox__input类，添加。点击打印时的情况，没了√。...
Jquery.jqprint.js打印局部Div带有样式
a406502972的专栏
07-23 2187
引入的js文件 &lt;script src="../js/jquery-1.4.2.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="../js/jquery.jqprint-0.3.js" type="text/javascript"&gt;&lt;/script&gt;   j
前端打印样式乱了_前端开发console调试中，那些不可忽视的用法
weixin_39965514的博客
11-30 403
点击右上方红色按钮关注“小郑搞码事”，每天都能学到知识，搞懂一个问题！前端代码调试使用console是大家最熟悉的一种。然而，真正使用的最多的可能就是console.log在控制台输出点东西，其实，console还有很多其他的用法。一. 重提常规用法console.log("打印字符串"); //在控制台打印自定义字符串console.error("我是个错误");//在控制台打印自定义错误信息c...
jqprint 带CSS样式打印
李忠祥个人博客
05-08 1万+
$("#mytable").jqprint({             debug: false,              importCSS: false , //将此属性改为false；直接在style中写入样式即可             printContainer: true,              operaSupport: false    });&lt;table id="m...
jqprint打印的简单使用
weixin_43998604的博客
09-10 2683
最近做了一个项目，里面需要打印Echarts和部分介绍文字，看了网上很多例子，都写得不错，文字打印都没问题，但碰到Echarts就各种失效，好不容易找到原因，可以打印了，确发现只能打印一页，好气啊，不过最终还是找到了方法，所以今天就来分享下我的爬坑之路。 首先和网上的步骤一样，引下所需要的js文件： <script language="javascript" src="jquery-1.4....
jqprint 打印 table的一些坑
热门推荐
qq_32667777的博客
12-10 2万+
相信许多小公司的java开发人员，在工作的时候难免要用到许多的前端的知识（俗称全栈工程师），恐怕有时你写着写着会咒骂道：“我明明是好歹是个java工程师，为什么要然我去写页面这种前端干的活”，但是事实就是：你没办法不写这些代码，哈哈哈~~~ 入正题：最近在写一个功能时，需要打印非固定长度表格。看到原项目中用到jqprint这个插件，一看源码！！！就这几行代码，什么鬼！ 百度了解了一下，原来
使用jqprint插件实现打印
书山有鹿的博客
01-27 3337
jqprint是一个简单好用的打印插件，可以实现局部打印。 如何使用 1. 首先需要引入jquery的js文件和jqprint的js文件： <script type="text/javascript" src="/static/js/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="/static/js/tmpl/jquery.tmpl.min.js"></script> j
jquery jqprint 打印
qq_38730338的博客
09-18 1万+
介绍： jqprint是一个基于jQuery编写的页面打印的一个小插件，但是不得不承认这个插件确实很厉害，最近的项目中帮了我的大忙，在Web打印的方面，前端的打印基本是靠window.print()的方式进行打印的，而这个插件在其基础上进行了进一步的封装，可以打印网页上的某个区域，这是个亮点。比如说现在要打印如下的一个效果： 我们可以通过写代码完成上述的效果，然后单击网页上的某个按钮，在按钮的处...
vue使用print.js详解（打印不全、样式丢失等）
落花生
07-12 1万+
首先网上已经有很多使用步骤，比如 https://www.jianshu.com/p/c5363ddf7d43 相关链接：pringt.js github地址里面也有使用说明 主要记录以下使用时发现的问题： 1.样式问题 我使用的element组件，发现分栏布局 xs\md\lg没有效果。我想大概这种组件封装的样式使用都有点问题。从这思路去入手解决吧。我看了许多，目前好像没有什么好的解决样式的方法。（我的改动不大，把css改成了本地媒体查询显示百分比。当然打印时，只使用基础的显示样式，不会根据屏.
解决打印组件print-js在vue中使用时字体样式失效的问题
qq_38389533的博客
08-31 2956
解决print-js在vue中使用时字体样式失效的问题
class jqprint 失效_jquery 打印没有CSS怎么解决？
weixin_39956182的博客
12-31 759
展开全部解决方法：要把css代码放入my_show里面，跟打印的内容放在一起32313133353236313431303231363533e58685e5aeb931333365633864，让jquery一起加载，才能生效。具体操作：一、添加打印样式1. 为屏幕显示和打印分别准备一个css文件，如下所示：用于屏幕显示的css： 用于打印的css：2. import方式：@import url(...
HTML调用浏览器打印功能，jqprint插件打印页面css失效的解决办法
刺心的博客
11-05 2810
@media print { //在此处写打印后的样式 } 一个页面只能引入一个打印css配置，引入多个css，则不能添加meta="print"属性，同时添加此属性插件读取不到。 如果需要打印的页面引入单个css，meta="print"为非必须项，即以下两种均可 <link href="a.css" rel="stylesheet" meta="print"> ...
js 打印插件（jQuery打印插件jqprint），样式不丢失，想打哪里就打哪里。
m0_37973043的博客
07-01 2151
插件下载及使用方法介绍地址 http://www.jq22.com/jquery-info347 解决样式丢失 按照上面方法配置好后发现样式会丢失，解决办法利用外链式CSS，将页面中的CSS复制一份到某个目录下 <link media="print" rel="stylesheet" type="text/css" href="XXX.css"> //注意一定要加media="print"这个就是打印预览页面的CSS，预览效果不理想通过这个样式文件调整。 自己页面里的CSS是展示在浏览器上的样式
bootstrap或者layui框架使用row-col布局jquery.PrintArea打印样式丢失问题
u013193633的博客
05-13 734
笔者在使用layui框架用row-col栅格布局的时候，使用row 和col-md-*进行页面布局，调用jquery.PrintArea进行打印div，发现bootstrap排列样式全部丢失，初步怀疑是没有引用css的问题，但是检查代码后发现css是正常引用的 最终检查发现其实是打印的屏幕尺寸是小于col-md的，所以需要在引col-md属性的同时一并引用col-xs属性，这样打印页面排版就是正常的了 注：bootstrap框架的解决方案同上 ...
jqprint插件打印页面css失效的解决办法
滴水石穿
09-04 5970
jqprint插件作为前端一个打印页面插件简单易用，相关配置如下： 请注意!很多朋友遇到Cannot read property 'opera' of undefined错误问题是juqery版本兼容问题 解决方法：加入迁移辅助插件jquery-migrate-1.0.0.js可解决版本问题 1 <scriptsrc="http://www.jq22....
关于jquery.jqprint 打印 table的一些坑
SuperCookies的博客
05-17 6165
关于jquery.jqprint 打印 table的一些坑一、案例&lt;!doctype html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;jQuery打印插件jqprint&lt;/title&gt; &lt;!-- &lt;script language="j
jquery.print 时间_Jqprint实现页面打印
weixin_39956022的博客
12-19 306
好些项目需要实现页面打印，特别是一些后台管理类系统，下面介绍一款轻量级的打印插件：1、实现页面打印要引入jQuery和Jqprint。点击下载Jqprint插件2、HTML代码：testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest3、JavaScrip...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值