winform打印的方案比较多,实现也比较容易,而且效果也非常炫;但现在越来越多的系统是web系统,甚至是移动端。网上也有非常的web打印方案,但各式各样的问题非常多,比如js兼容性,稳定性等一直缠绕着众多的程序员,或者就是web 打印需要浏览器安装 ActiveX 组件,ActiveX安装不容易成功等等问题。

  下面我们来看一种web在线阅览,在线编辑,在线打印的解决方案,Lodop这一款在线打印工具在各版本浏览器的兼容性表现不错,功能方面,我们常用的打印阅览,打印设计,打印机设置等他都提供了,而且额外的功能也是很多的,足够我们开发使用了。他对浏览器安装 ActiveX 组件提供了另外一种方法,首先检测有没有安装插件,未检测到插件时,自动提示,并给出下载插件的地址,这里的插件使用的是exe 格式的,这样就避免了浏览器安全设置的问题,至于怎么安装这里就不在赘述。

  1.准备工作:

  下载lodop:http://www.lodop.net/uploads/file/Lodop6.198.zip解压后放到工程中,在页面引入如下代码:

<script src="~/Scripts/Lodop组件包/LodopFuncs.js"></script>

<script type="text/javascript" language="javascript" src="../Lodop/LodopFuncs.js"></script>
<object id="LODOP" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width="0" height="0"> 
    <embed id="LODOP_EM" type="application/x-print-lodop" width="0" height="0" pluginspage="../Lodop/install_lodop.exe"></embed>
</object>

  其中: <embed id="LODOP_EM" type="application/x-print-lodop" width="0" height="0" pluginspage="../Lodop/install_lodop.exe"></embed>

是专为 FireFox 浏览器设计的代码,如果你这个打印控件只在 IE 上应用,那么上面这名话完全可以不用的。

只这样加就行了:

<script type="text/javascript" language="javascript" src="../Lodop/LodopFuncs.js"></script>
<object id="LODOP" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width="0" height="0"> 
</object>

  把这些引入页面以后,剩下的就是一些基本的lodop API调用了。

  2.加几个按钮调用

  <div class="toolbar">
             @x.Button("打印预览").Icon("icon-printView").Click("print_preview()").ToolTip("打印预览")
             @x.Button("直接打印").Icon("icon-print").Click("print()").ToolTip("直接打印")
             @x.Button("选择打印机").Icon("icon-selectPrinter").Click("print_printA()").ToolTip("选择打印机")
             @x.Button("打印维护").Icon("icon-printSetup").Click("printSetup()").ToolTip("打印维护")
             @x.Button("打印设计").Icon("icon-printDesign").Click("printDesign()").ToolTip("打印设计")
 </div>

  3.这些按钮对应的方法  

 var LODOP; //声明为全局变量
 // 打印预览
 function print_preview() {
     CreatePrintPage();
     LODOP.PREVIEW();
 };
 // 直接打印
 function print() {
     CreatePrintPage();
     LODOP.PRINT();
 };
 // 选择打印机
 function print_printA() {
     CreatePrintPage();
     LODOP.PRINTA();
 };
 //打印维护
 function printSetup() {
     CreatePrintPage();
     LODOP.PRINT_SETUP();
 };
 //打印设计
 function printDesign() {
     CreatePrintPage();
     LODOP.PRINT_DESIGN();
 };
 // 创建打印页面
 function CreatePrintPage() {
     LODOP = getLodop();
     LODOP.PRINT_INIT("web在线打印");
     LODOP.SET_PRINT_PAGESIZE(, , , "A4");
     //设置打印页面属性:2:表示横向打印,0:定义纸张宽度,为0表示无效设置,A4:设置纸张为A4
     //LODOP.ADD_PRINT_TEXT(50, 231, 260, 39, "打印页面部分内容");
     LODOP.SET_PRINT_STYLE();
     LODOP.SET_PRINT_STYLE();
     LODOP.ADD_PRINT_HTM(, , , , $(].contentWindow.document.body.innerHTML);
 }

  具体API不用详细介绍,这里只说一下ADD_PRINT_HTM(intTop,intLeft,intWidth,intHeight,strHtml)增加超文本项,

$('#CurrentDocumentPage')[0].contentWindow.document.body.innerHTML,就是Iframe页面的内容,需要仔细研究的可以到lodop官网查阅。
  <div id="DocumentViewerSummary" style="margin: 5px;height:auto; width: auto; text-align: center">
             <iframe id="CurrentDocumentPage" style="width: 98.5%; height: 97%; min-height: 480px; text-align: center;
                     position: relative;margin: 5px;padding-top: 5px;padding-left: 5px;"></iframe>

 </div>

$("#CurrentDocumentPage").attr("src", viewUrl);

  4.最终效果

  页面内容

  打印阅览

   打印维护的目标用户是页面操作者,开发者在根据业务需要将该界面提供给操作者时,有时会发现其默认功能权限不符合业务要求(亦多亦少),如下是默认的功能权限范围,试着改变勾选,看看演示程序是如何通过SET_SHOW_MODE函数解决这一问题的。

1:位置移动和宽高调整
2:颜色选择
3:字体名选择
4:字大小选择
5:旋角调整
6:粗斜体功能条
7:线型功能条

8:对齐功能条
 9:删除功能
10:页眉设置
11:页脚设置
12:位置锁定功能
13:属性设置
14:显示关闭钮(界面内嵌时)

  打印机设置 

  5.总结:

  最后,简单说下Lodop的优势吧:

    (1)、操作简单,API通俗易懂,兼容性好,主流的浏览器都支持了;

    (2)、插件能实现自动安装提醒,并且不需要其他额外的设置;

    (3)、打印维护能够实现权限控制,比如在不修改内容的前提下修改打印的样式,比如调整字体,比如调整位置等等

    (4)、用户设计的打印页面,可以作为个性化的个人设置,系统维护的同一个模板可以适应不同的打印机。

web在线打印,打印阅览,打印维护,打印设计的更多相关文章

  1. 吉特仓储管系统(开源WMS)--Web在线报表以及打印模板分享

    很早之前就想写这篇文章与大家分享一下自己在吉特仓储管理系统中开发打印和报表的功能,在GitHub(https://github.com/hechenqingyuan/gitwms)上公开下载的代码中很 ...

  2. 想请问下PDF双面打印时(打印机自动双面打印)为什么反面那页的内容是倒过来的,应该怎么设置?

    用foxit reader 打印pdf 直接设置为双面打印并且一张2页打印,发现正反面刚好倒着来的,其实说的正反面倒着是从左右翻的角度来讲的,如果上下翻会发现刚好是这个顺序的,这个是要在双面打印设置里 ...

  3. JS 打印功能代码可实现打印预览、打印设置等

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.or ...

  4. kernel中,dump_stack打印调用栈,print_hex_dump打印一片内存,记录一下

    kernel中,dump_stack打印调用栈,print_hex_dump打印一片内存,记录一下

  5. 优雅的重载toString方法,打印对象内容而不是打印内存地址的方法

    如果直接在日志或者System.out.println中打印java对象,会打印这个对象的内存地址,而不是具体内容. 为了便于调试,一般的做法有2种: 1.重写toStrong方法 2.将对象传入JS ...

  6. 【docker】docker部署spring boot服务,但是docker logs查看容器输出控制台日志,没有日志打印,日志未打印,docker logs不打印容器日志

    如题: docker部署spring boot服务,但是docker logs查看容器输出控制台日志,没有日志打印,日志未打印,docker logs不打印容器日志 场景再现: docker部署并启动 ...

  7. C# 使用printDocument1.Print打印时不显示 正在打印对话框

    C#使用printDocument1.Print打印时不显示正在打印对话框有两种方法 第一种,使用PrintController       PrintController printControll ...

  8. 62. 用流程自带的打印功能,IE浏览器打印出来是空白

    用流程自带的打印功能,IE浏览器打印出来是空白的这个问题确认是由于IE启用了兼容模式导致的了把IE的兼容模式关掉就行了

  9. C# 使用printDocument1.Print打印时不显示 正在打印对话框(里面还有一个讨厌的取消按钮)

    C#使用printDocument1.Print打印时不显示正在打印对话框有两种方法 第一种,使用PrintController PrintController printController = n ...

随机推荐

  1. Git版本控制常用命令整理

    基础命令: git init  初始化一个空仓库 git add 添加已经修改的工作区文件 git add newmodifiedfile git commit -m "log conten ...

  2. 【小白的CFD之旅】01 引子

    小白的CFD之旅 写在前面 CFD是计算流体力学的英文简称,是计算机辅助工程(CAE)的主要分支,目前广泛应用与科学研究.工程设计中.这是一门综合了数学.计算机及流体力学的综合学科,涉及到众多的专业理 ...

  3. BI报表系统在银行业的应用

    在当前大数据的背景下,银行业传统联机业务技术存在开发周期长.不够灵活.大量的业务数据难以充分利用.操作复杂.监控效率低等弊端,多数企业表示需要搭建一个符合银行特色的商业智能平台,把需要的数据和信息集中 ...

  4. Chrome Developer Tools:Network Panel说明

    官方资料:Chrome Developer Tools: Network Panel 一.chrome Developer Tools:Network Panel 从网络面板中可以获取很多有用信息,如 ...

  5. ClearContainer 网络部分源码分析

    // cc-oci-runtime/src/oci.c /*! * Create the state file, apply mounts and run hooks, but do not star ...

  6. 第8章 Java类的三大特性之一:封装

    1.什么是封装 1.1概念 将类的某些信息隐藏在类内部,不允许外部程序直接访问,而是通过该类提供的方法来实现对隐藏信息的操作和访问.主要是类的属性 1.2好处 a.只能通过规定的方法访问数据b.隐藏类 ...

  7. pycharm的使用破解和Anaconda的使用

    1.pycharm的破解: 版本: pycharm 2016.2.3 链接: 下载专业版本   下面是这个版本的注册码: 43B4A73YYJ-eyJsaWNlbnNlSWQiOiI0M0I0QTcz ...

  8. jquery工具方法access详解

    access : 多功能值操作(内部) access方法可以使set/get方法在一个函数中体现.比如我们常用的css,attr都是调用了access方法. css的使用方法: $(selector) ...

  9. 简单了解ICMP协议

    ping命令是什么协议? 维基百科: ping是一种电脑网络工具,用来测试数据包能否通过IP协议到达特定主机.ping的运作原理是向目标主机传出一个ICMP echo@要求数据包,并等待接受echo回 ...

  10. Python基础+Pythonweb+Python扩展+Python选修四大专题 超强麦子学院Python35G视频教程

    [保持在百度网盘中的, 可以在观看,嘿嘿 内容有点多,要想下载, 回复后就可以查看下载地址,资源收集不易,请好好珍惜] 下载地址:http://www.fu83.cc/ 感觉文章好,可以小手一抖 -- ...