美文网首页
前端打印

前端打印

作者: Here517 | 来源:发表于2017-11-29 22:01 被阅读0次

使用window.print()打印

<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type"content="text/html; charset=UTF-8"/>
<style type="text/css"media="print">
function print(id)  
{  
  if (confirm('确定打印吗?')) {
      var newstr = document.all.item(id).innerHTML;
      printWindow = window.open();
      printWindow.document.write(newstr);
      printWindow.print();
      return false;
    }
} 
</style>
</head>
<body>
<img id="img" src="image.jpg" style="width:100%"/>
<input type="button" text="打印" onclick="print(img)"/>
</body>
  • 优点
    1.通过简单的代码就能调用打印机
    2.可以打印网页中任何内容
  • 缺点
    • 不能调整打印参数,导致打印出来的东西不美观。

调用浏览器本身打印插件

需要自己构建打印模板,即通过自定义一个网页模板做成需要的打印单,然后使用浏览器自带的打印功能打印整个页面也就能达到预期的效果。


Paste_Image.png
  • 优点
    页面格式整齐,有一定的自定义功能,并且实现简单开发成本较低。
  • 缺点
    一个页面只能对应一张打印单,而且不能很好的控制分页,页面格式等相关参数,属于一种特殊的前端打印。

使用PDF文件进行打印

由于前端浏览器对PDF浏览和打印支持比较完善,所以可以将需要打印的数据封装到PDF文件中,并且java操作PDF文件页相对完善,故可以使用PDF的方式。

使用插件进行打印

可采用的java打印插件

  • FineReport
  • 润乾
  • ActiveReports 报表控件

相关文章

  • 前端 直接打印解决方案

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

  • 前端打印

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

  • 前端打印

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

  • 前端打印

    1.直接使用window.print() 打印 2.设置分页在需要分页的地方设置page-break-after:...

  • 前端打印

    方法1 步骤: 1、用html2canvas,将html转image2、image放入jsPDF中3、window...

  • 前端打印,vue打印

    按以下操作就成

  • 【vue学习】整合Lodop

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

  • CSS 打印功能

    相关资料参考: 如何在 css 中设置打印分隔页: 参考资料: CSS 打印 前端打印功能css print

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

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

  • 打印网页时,前端写法

    打印网页时,在保证打印效果的前提下,前端要怎么写呢 1.在打印时调用的样式(px--->pt(打印时使用pt)、样...

网友评论

      本文标题:前端打印

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