美文网首页
jQuery.print实现前端打印

jQuery.print实现前端打印

作者: Sun____ | 来源:发表于2021-02-03 11:44 被阅读0次

jQuery.print是一个用于打印页面特定部分的插件。

一、安装

1. npm安装: npm install jQuery.print

2. 到github下载

下载地址:https://github.com/DoersGuild/jQuery.print,然后再html中引用<script type="text/JavaScript" src="path/to/jquery.print.js"></script>

二、 使用

$("#myElementId").print(/*options*/);
/* 或者 */
$.print("#myElementId" /*, options*/);

三、 参数配置

$("#myElementId").print({
    globalStyles: true,
    mediaPrint: false,
    stylesheet: null,
    noPrintSelector: ".no-print",
    iframe: true,
    append: null,
    prepend: null,
    manuallyCopyFormValues: true,
    deferred: $.Deferred(),
    timeout: 750,
    title: null,
    doctype: '<!doctype html>'
});

globalStyles: 默认true;接收值:Boolean;功能:是否包含来自父文档的样式

mediaPrint: 默认false;接收值:Boolean;功能:是否包含media='print'的链接标签;由globalStyles选项重写

stylesheet: 默认null;接收值:URL-string;功能:要包含的外部样式表的URL

noPrintSelector: 默认值".no-print";接收值:有效的jQuery-selector;功能:要排除在打印之外的项的选择器

iframe: 默认值true,如果传递了无效的iframe选择器,则创建一个隐藏的iframe;接收值:任何有效的jQuery-selector或Boolean;功能:是否从iframe而不是弹出窗口打印;可以接受jquery -选择器的一个现有的iframe的值

append/prepend: 默认值null;接收值:任何有效的jQuery-selector或HTML-text;功能:在选定内容之前(前置)或之后(追加)添加自定义HTML

manuallyCopyFormValues: 默认值true;接收值:Boolean;功能:它是否应该将用户更新的表单输入值复制到打印的标记上(这是通过手工遍历每个表单元素来完成的)

deferred: 默认值$.Deferred();接收值:任何有效的jQuery.Deferred对象;功能:一个jQuery。调用print函数后解析的Deferred对象。可以用来设置回调-参见wiki

timeout: 默认值750;接收值: setTimeout的时间(毫秒);功能:在新创建的窗口/iframe中打印元素之前,改变等待内容等加载的最大时间,作为新窗口/iframe的加载事件尚未触发时的回滚

title: 默认值null,使用主机页面标题;接收值:任何单行字符串;功能:更改打印的标题

doctype: 默认值:'<!doctype html>';接收值:任何有效的doctype字符串;功能:在打印的文档框架前添加文档类型

相关文章

  • jQuery.print实现前端打印

    jQuery.print[https://github.com/DoersGuild/jQuery.print]是...

  • 【vue学习】整合Lodop

    前端实现自动打印 批量打印 vue中使用lodop调用标签打印机 利用lodop打印控件轻松实现批量打印 本文主要...

  • 前端实现打印功能(筛选打印表格)

    前端实现打印也并没有那么难。起初是后端实现打印,前端调取接口,但无法实现单选框的样式,无法对数据进行筛选,这才选择...

  • 前端打印

    简单介绍一下前端打印的做法和一些问题 一、简介 前端打印即浏览器打印,是通过浏览器的打印功能来实现打印效果的做法。...

  • 前端实现打印功能

    打印样式 一、添加打印样式 为屏幕显示和打印分别准备一个css文件,如下所示:用于屏幕显示的css: 用于打印的...

  • 前端vue项目实现单页打印功能

    前端vue项目实现单页打印功能 vue-print-nb插件:这是用于打印,简单,快速,方便,轻便的指令包装。安装...

  • 前端页面局部打印功能实现

    先看打印的效果 网上找到的实现如下: doPrint (){ //获取当前页的html代码 varbdhtml=w...

  • Vue之前端实现打印效果

    今天小编在教课的时候,发现很多刚刚接触这个领域的同学对一些小的细节部分还是存在疑惑,网上的很多博客也只是只贴出了代...

  • 前端 直接打印解决方案

    前端 打印操作 取消弹出选择 问题描述:前端在执行打印操作时,浏览器会弹出 选择打印机等相关设置,在进行批量打印时...

  • 前端打印

    使用window.print()打印 优点1.通过简单的代码就能调用打印机2.可以打印网页中任何内容 缺点不能调整...

网友评论

      本文标题:jQuery.print实现前端打印

      本文链接:https://www.haomeiwen.com/subject/dsvptltx.html