安全下载,经人工审核 精选优质前端模板 支持定制开发咨询 持续更新资源
支持自定义打印区域的 jQuery 打印插件
编号:自定义打印

支持自定义打印区域的 jQuery 打印插件

大小 423 KB
总文件 12 个
发布 2024-07-01
更新 2026-01-17
架构 jQuery
分类 前端资源 - 小工具
目录 结构详情
童哲网
童哲网
 ·  专注前端模板资源分享
人工审核 安全可信

    这是一款超棒的 jQuery 打印插件,可让您为网页/应用程序添加打印页面功能,该插件可打印页面上的特定区域或特定的页面元素,可用于单独或者组合打印网页的图像、画布 canvas 和纯文本,以及(可选的)自定义页眉和页脚,此外,您还可以禁用页面中的 CSS 样式和 JavaScript。同时提供了超过高级选项的配置,如下所示。

主要功能

打印特定或者多个 DOM 元素

保留页面 CSS/样式或添加新的 CSS,核心尽在掌握!

保留表单条目

画布支持

可从打印文本中移除 JavaScript、内联样式和 CSS。

导入样式标签等等...

使用 jquery 打印网页部分的高级配置选项

以下是一些用于创建/自定义 PrintThis 插件(网页的 jQuery 打印部分)的高级配置选项。

选择描述、默认、类型
debug

对于开发人员模式,它显示用于调试的 iframe。默认值:false,类型:Boolean。

$("#myText").printThis({
   debug: false,
});
importCSS

导入页面样式表,使用CSS样式打印页面。默认值:true,类型:Boolean。

$("#myText").printThis({
   importCSSL: true,
});
importStyle

在样式标记之间导入内联 CSS 样式。默认值:false,类型:Boolean。

$("#myText").printThis({
   importStyle: false,
});
printContainer

抓取外部容器以及选择器的内容。默认值:true,类型:Boolean。

$("#myText").printThis({
   printContainer: true,
});
loadCSS

此选项可用于添加额外的 css 文件 – 使用数组 [] 表示多个。默认值:“”,类型:字符串。

$("#myText").printThis({
   loadCSS: "path/to/my.css",
});
pageTitle

定义标题并将其打印到页面顶部。默认值:“”,类型:字符串。

$("#myText").printThis({
    pageTitle: "My Custom Title", 
});
removeInline

此选项“从打印元素中删除常见内联样式”。默认值:false,类型:Boolean。

$("#myText").printThis({
   removeInline: true,
});
printDelay

定义以毫秒为单位的打印延迟。默认值:333,类型:数字。

$("#myText").printThis({
   printDelay: 1500,
});
header & footer

定义 HTML 页面的自定义页眉和页脚。默认值:null,类型:字符串。

$("#myText").printThis({
  header: "Custom Page Header",
  footer: "Custom Page Footer",
});
base

保留 BASE 标记,或接受 URL 的字符串。默认值:false,类型:Boolean/String。

$("#myText").printThis({
    base: "url here",
});
formValues

此外,在表单中打印用户输入值。默认值:true,类型:Boolean。

$("#myText").printThis({
   formValues: true,
});
canvas

复制画布元素。默认值:false,类型:Boolean。

$("#myText").printThis({
    canvas: false,
});
doctypeString

定义网页的文档类型。对于为旧标记添加文档类型很有用。默认值:“”,类型:字符串。

$("#myText").printThis({
   doctypeString: "",
});
hasModal

从打印内容中删除脚本标签。默认值:false,类型:Boolean。

$("#myText").printThis({
  removeScripts: false,
});
copyTagClasses

此选项对于从 html & body 标签复制类很有用。默认值:false,类型:Boolean。

$("#myText").printThis({
   copyTagClasses: false,
});

回调函数

PrintThis 插件提供了三个自定义回调函数,可以执行这些函数以将其完全配置到您的项目中。默认情况下,这些选项在类型函数中为 null。

1. iframe 中的回调函数。printEvent

$("#myText").printThis({
 beforePrintEvent: function(){
    //your code to execute
   }
});

2. 在填充 iframe 之前调用的函数。

$("#myText").printThis({
 beforePrint: function(){
    //your code to execute
   }
});

3. 删除 iframe 之前调用的函数。

$("#myText").printThis({
 afterPrint: function(){
    //your code to execute
   }
});

模板目录结构

    免责声明

    • 如非特殊说明,本站对本文提供的代码或者素材不拥有任何权利,其版权归原著者拥有。
    • 以上提供的代码或者素材均为作者提供和网友推荐收集整理而来,仅供学习和研究使用。
    • 如有侵犯你版权的,请来信(邮箱:tongzhewangluo@163.com)指出,核实后本站将立即改正。
    • 如有链接无法下载、失效或广告,请通过网站提供的微信联系作者!
    • 以上资源售价只是赞助,不代表代码或者素材本身价格,收取费用仅维持本站的服务器开销。
    • 所有代码素材效果均为演示打包,最终效果请参考演示效果,本站不提供任何技术支持和服务。
    • 代码素材均为虚拟物品,演示和描述无错的情况下,无法进行退换服务。

    最新资源

    软件、SaaS等IT服务企业专用 Tailwind CSS 响应式网站模板

    赫斯顿

    软件、SaaS等IT服务企业专用 Tailwind CSS 响应式网站模板
    人工智能与AI机器学习等高科技企业专用 HTML5 响应式网站模板

    纽睿科

    人工智能与AI机器学习等高科技企业专用 HTML5 响应式网站模板
    泳池清洁与维护服务 HTML 响应式网站模板

    普乐适

    泳池清洁与维护服务 HTML 响应式网站模板
    Tailwind CSS 电商购物网站布局 水杯品牌产品展示页模板

    产品网格布局

    Tailwind CSS 电商购物网站布局 水杯品牌产品展示页模板
    纯 CSS 毛边渐变描边文字 悬停渐变流动标题效果

    渐变描边文字

    纯 CSS 毛边渐变描边文字 悬停渐变流动标题效果
    Three.js 3D 日落海景动画 Canvas 海面光影实时渲染

    3D 日落动画

    Three.js 3D 日落海景动画 Canvas 海面光影实时渲染