网页打印很简单！用web打印插件lodop轻松实现文件打印

最近，给客户发一个事件提醒软件，其中客户要求实现打印功能，因为是用asp.net mvc 开发首先考虑到用水晶报表来实现（crystalReport），以前开发c# winform程序，感觉水晶报表还是蛮好的，但自从使用asp.net mvc 开发，感觉不是很友好,无意中看到有一个支持web（网页打印）的打印插件lodop，打开官网，发现该软件比较正规，网上评价也是比较好，抱着试试看的态度，去官方网站：Lodop和C-Lodop官网主站，下载并安装。根据官方文档，并结合自己的经验，特分享如下：

网页效果如图：

实现的打印效果图示如下：

很是干净和整洁。非常漂亮！

登录官网（Lodop和C-Lodop官网主站），下载相关安装文件：

安装包如下，根据图示安装：

本人在c# asp.net mvc 下测试，读者可以根据自己熟悉的语言对号入座。分享代码如下：

1.当然首先在vs2022中的工程项目界面要引入，LodopFuncs.js

2.部分代码如下： 

<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title><script language="javascript" src="LodopFuncs.js"></script>
</head>
<body><form id="form1"><table border="1" width="300" id="tb01" bgcolor="#CCFFCC" style="border: solid 1px black; border-collapse: collapse"><tr><td width="133" id="mtb001"><font face="黑体" color="#FF0000" size="3"><u>&nbsp;《表单一》&nbsp;</u></font></td></tr></table><table border="1" width="300" height="106" cellspacing="0" bgcolor="#CCFFFF" style="border-collapse: collapse; table-layout: fixed; border: solid 1px black;"><tr><td width="66" height="16" style="border: solid 1px black"><font color="#0000FF">A</font><font color="#0000FF">等</font></td><td width="51" height="16" style="border: solid 1px black"><font color="#0000FF">B</font><font color="#0000FF">等</font></td><td width="51" height="16" style="border: solid 1px black"><font color="#0000FF">C</font><font color="#0000FF">等</font></td></tr><tr><td width="66" height="16" style="border: solid 1px black">A<sub>01</sub></td><td width="80" height="12" style="border: solid 1px black">中-001</td><td width="51" height="12" style="border: solid 1px black">C1<sup>x</sup></td></tr><tr><td width="66" height="16" style="border: solid 1px black">A<sub>02</sub>Φ</td><td width="80" height="16" style="border: solid 1px black">日-スの</td><td width="51" height="16" style="border: solid 1px black"><font face='Vernada'>7&#13221</font></td></tr><tr><td width="66" height="16" style="border: solid 1px black; overflow: hidden">A<sub>03</sub><nobr>over隐藏后面的：1234567890</nobr></td><td width="80" height="16" style="border: solid 1px black; overflow: hidden">韩-안녕</td><td width="51" height="16">C3<sup>x</sup></td></tr></table></form>若只打印《表单一》,看一下<a href="javascript:prn1_preview()">打印预览</a>,可<a href="javascript:prn1_print()">直接打印</a>也可 <script language="javascript" type="text/javascript">   var LODOP; //声明为全局变量 function prn1_preview() {CreateOneFormPage();LODOP.PREVIEW();};function prn1_print() {CreateOneFormPage();LODOP.PRINT();};function prn1_printA() {CreateOneFormPage();LODOP.PRINTA();};function CreateOneFormPage() {LODOP = getLodop();LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_表单一");LODOP.SET_PRINT_STYLE("FontSize", 18);LODOP.SET_PRINT_STYLE("Bold", 1);LODOP.ADD_PRINT_TEXT(50, 231, 260, 39, "打印页面部分内容");LODOP.ADD_PRINT_HTM(88, 200, 350, 600, document.getElementById("form1").innerHTML);};function prn2_preview() {CreateTwoFormPage();LODOP.PREVIEW();};function prn2_manage() {CreateTwoFormPage();LODOP.PRINT_SETUP();};function CreateTwoFormPage() {LODOP = getLodop();LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_表单二");LODOP.ADD_PRINT_RECT(70, 27, 634, 242, 0, 1);LODOP.ADD_PRINT_TEXT(29, 236, 279, 38, "页面内容改变布局打印");LODOP.SET_PRINT_STYLEA(2, "FontSize", 18);LODOP.SET_PRINT_STYLEA(2, "Bold", 1);LODOP.ADD_PRINT_HTM(88, 40, 321, 185, document.getElementById("form1").innerHTML);LODOP.ADD_PRINT_HTM(87, 355, 285, 187, document.getElementById("form2").innerHTML);LODOP.ADD_PRINT_TEXT(319, 58, 500, 30, "注：其中《表单一》按显示大小，《表单二》在程序控制宽度(285px)内自适应调整");};function prn3_preview() {LODOP = getLodop();LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_全页");LODOP.ADD_PRINT_HTM(0, 0, "100%", "100%", document.documentElement.innerHTML);LODOP.PREVIEW();};</script>
</body>
</html>

3.考虑到部分读者可能看不懂，补充完整代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WEB打印控件LODOP的样例二:打印当前页面的内容</title>
<meta name="keywords" content="Lodop、Lodop打印控件、WEB打印、C-Lodop、CLodop、lodop控件、云打印、手机打印、免费、AO打印">
<meta name="description" content="Lodop、Lodop打印控件、WEB打印、C-Lodop、CLodop、lodop控件、云打印、手机打印、免费、AO打印">
<script language="javascript" src="LodopFuncs.js"></script>
</head>
<body>
<iframe src="https://help.lodop.net:8143/k_hlp?type=url&fid=DA" width="500" height="46" frameborder="0" scrolling="no" style="float:right;background:inherit;"></iframe>
<h2><font color="#009999">演示如何打印当前页面的内容：</font>
</h2>
<form id="form1"><table border="1" width="300" id="tb01" bgcolor="#CCFFCC" style="border:solid 1px black;border-collapse:collapse"><tr><td width="133" id="mtb001"><font face="黑体" color="#FF0000" size="3"><u>&nbsp;《表单一》&nbsp;</u></font></td></tr></table><table border="1" width="300" height="106" cellspacing="0" bgcolor="#CCFFFF"style="border-collapse:collapse;table-layout:fixed;border:solid 1px black;"><tr><td width="66" height="16" style="border:solid 1px black"><font color="#0000FF">A</font><font color="#0000FF">等</font></td>
<td width="51" height="16" style="border:solid 1px black"><font color="#0000FF">B</font><font color="#0000FF">等</font></td>
<td width="51" height="16" style="border:solid 1px black"><font color="#0000FF">C</font><font color="#0000FF">等</font></td></tr> 
<tr>
<td width="66" height="16" style="border:solid 1px black">A<sub>01</sub></td>
<td width="80" height="12" style="border:solid 1px black">中-001</td>
<td width="51" height="12" style="border:solid 1px black">C1<sup>x</sup></td>
</tr> 
<tr>
<td width="66" height="16" style="border:solid 1px black">A<sub>02</sub>Φ</td>
<td width="80" height="16" style="border:solid 1px black">日-スの</td>
<td width="51" height="16" style="border:solid 1px black"><font face='Vernada'>7&#13221</font></td>
</tr> <tr><td width="66" height="16" style="border:solid 1px black;overflow:hidden">A<sub>03</sub><nobr>over隐藏后面的：1234567890</nobr>
</td><td width="80" height="16" style="border:solid 1px black;overflow:hidden">韩-안녕</td><td width="51" height="16">C3<sup>x</sup>
</td></tr> </table>
</form>
<br>
<div id="form2"><table border="1" width="100%" id="tb01" bgcolor="#CCFFCC" style="border:solid 1px black;border-collapse:collapse"><tr><td width="133" id="mtb001"><font face="黑体" color="#FF0000" size="3">《表单二》&copy;</font></td></tr></table><table border="1" width="100%" height="106" cellspacing="0" bgcolor="#CCFFFF" style="border:solid 1px black;border-collapse:collapse"><tr><td width="66" height="16" style="border:solid 1px black"><font color="#0000FF">X</font><font color="#0000FF">等</font></td>
<td width="51" height="16" style="border:solid 1px black"><font color="#0000FF">Y等</font></td>
<td width="51" height="16" style="border:solid 1px black"><font color="#0000FF">Z等</font></td></tr> <tr><td width="66" height="12" style="border:solid 1px black"><span style="font-family:Wingdings;font-size:25px;" >&#254;</span>X001</td>
<td width="51" height="12" style="border:solid 1px black"><strike>Y001</strike></td>
<td width="51" height="44" rowspan="3"  style="border:solid 1px black"><ol style="list-style-type:upper-alpha;list-style-position:inside;"><li>Z001</li><li>Z002</li><li>Z003</li><li>Z004</li><li>Z005</li></ol></td></tr> 
<tr><td width="30%" height="16" style="border:solid 1px black"><strong>X002</strong></td>
<td width="51" height="16"  style="border:solid 1px black"><u>Y002</u><span style="visibility: hidden">hidesome</span></td></tr> <tr><td width="30%" height="16" style="border:solid 1px black"><span style="text-decoration: overline">X003</span>
</td><td width="40%" height="16" style="border:solid 1px black"><em>Y003</em><input type="radio" name="R1"><input type="radio" name="R1" checked></td></tr> </table>
</div>
<p>1：若只打印《表单一》,看一下<a href="javascript:prn1_preview()">打印预览</a>,可<a href="javascript:prn1_print()">直接打印</a>也可      
<a href="javascript:prn1_printA()">选择打印机</a>打印。<br><br>
2：若《表单一》和《表单二》一起并列输出,看一下<a href="javascript:prn2_preview()">打印预览</a>,其布局风格可<a href="javascript:prn2_manage()">打印维护</a>调整。
<p>3：若打印整个页面,看看<a href="javascript:prn3_preview()">打印预览</a>。<br><br>
本例要点是用Document的innerHTML方法把打印目标的超文本送给控件。  
<p><a href="../LodopDemo.html">&lt;&lt;回样例目录</a>
</p>   
<script language="javascript" type="text/javascript">   var LODOP; //声明为全局变量 function prn1_preview() {	CreateOneFormPage();	LODOP.PREVIEW();	};function prn1_print() {		CreateOneFormPage();LODOP.PRINT();	};function prn1_printA() {		CreateOneFormPage();LODOP.PRINTA(); 	};	function CreateOneFormPage(){LODOP=getLodop();  LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_表单一");LODOP.SET_PRINT_STYLE("FontSize",18);LODOP.SET_PRINT_STYLE("Bold",1);LODOP.ADD_PRINT_TEXT(50,231,260,39,"打印页面部分内容");LODOP.ADD_PRINT_HTM(88,200,350,600,document.getElementById("form1").innerHTML);};	                     function prn2_preview() {	CreateTwoFormPage();	LODOP.PREVIEW();	};function prn2_manage() {	CreateTwoFormPage();LODOP.PRINT_SETUP();	};	function CreateTwoFormPage(){LODOP=getLodop();  LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_表单二");LODOP.ADD_PRINT_RECT(70,27,634,242,0,1);LODOP.ADD_PRINT_TEXT(29,236,279,38,"页面内容改变布局打印");LODOP.SET_PRINT_STYLEA(2,"FontSize",18);LODOP.SET_PRINT_STYLEA(2,"Bold",1);LODOP.ADD_PRINT_HTM(88,40,321,185,document.getElementById("form1").innerHTML);LODOP.ADD_PRINT_HTM(87,355,285,187,document.getElementById("form2").innerHTML);LODOP.ADD_PRINT_TEXT(319,58,500,30,"注：其中《表单一》按显示大小，《表单二》在程序控制宽度(285px)内自适应调整");};              function prn3_preview(){LODOP=getLodop();  LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_全页");LODOP.ADD_PRINT_HTM(0,0,"100%","100%",document.documentElement.innerHTML);LODOP.PREVIEW();	};	
</script> </body>
</html>

如果错误，请斧正！谢谢！ 

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/pingmian/72050.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

Claude、ChatGPT、Gemini等主流AI模型。分别详细介绍它们并进行对比，需要指出关键的时间点

Claude、ChatGPT、Gemini等主流AI模型。分别详细介绍它们并进行对比，需要指出关键的时间点

以下是关于Claude、ChatGPT和Gemini三大主流AI模型的详细介绍及对比分析&#xff0c;结合关键时间点和核心技术特征&#xff1a; 1. Claude&#xff08;Anthropic&#xff09; 关键时间点与版本迭代 2023年3月&#xff1a;初代Claude发布&#xff0c;定位为安全可控的对话模型…
阅读更多...
统计登录系统10秒内连续登录失败超过3次的用户

统计登录系统10秒内连续登录失败超过3次的用户

为防止暴力破解用户账号的行为&#xff0c;在输入账号和密码时一般都会限制用户尝试密码输出错误的次数&#xff0c;如果用户多次输错密码后&#xff0c;将在一段时间内锁定账号&#xff0c;常见的有银行类APP、个税App等应用&#xff0c;如下是用户账号密码输入错误的提示图&a…
阅读更多...
vue3通过render函数实现一个菜单下拉框

vue3通过render函数实现一个菜单下拉框

背景说明 鼠标移动到产品服务上时&#xff0c;出现标红的下拉框。 使用纯css的方案实现最简单&#xff0c;但是没什么技术含量&#xff0c;弃之&#xff1b;使用第三方组件库&#xff0c;样式定制麻烦弃之。因此&#xff0c;我们使用vue3直接在页面创建一个dom作为下拉框吧。…
阅读更多...
二、重学C++—C语言核心

二、重学C++—C语言核心

上一章节&#xff1a; 一、重学C—C语言基础-CSDN博客https://blog.csdn.net/weixin_36323170/article/details/146002496?spm1001.2014.3001.5502 本章节代码&#xff1a; cPart2 CuiQingCheng/cppstudy - 码云 - 开源中国https://gitee.com/cuiqingcheng/cppstudy/tree/…
阅读更多...
2-003：MySQL 三层 B+ 树能存多少数据？

2-003：MySQL 三层 B+ 树能存多少数据？

1. 计算 B 树能存储多少数据 参数设定 每个数据页&#xff08;Page&#xff09;大小&#xff1a;16KB&#xff08;16384 字节&#xff09;每个索引节点存储的子节点数量&#xff1a; 索引项大小&#xff1a; 假设 bigint&#xff08;主键&#xff09;占 8 字节每个索引项存储…
阅读更多...
几种常见的虚拟环境工具（Virtualenv、Conda、System Interpreter、Pipenv、Poetry）的区别和特点总结

几种常见的虚拟环境工具（Virtualenv、Conda、System Interpreter、Pipenv、Poetry）的区别和特点总结

在 PyCharm 中创建虚拟环境是一个非常直接的过程&#xff0c;可以帮助你管理项目依赖&#xff0c;确保不同项目之间的依赖不会冲突。 通过 PyCharm 创建虚拟环境 打开 PyCharm 并选择或创建一个项目。 打开项目设置&#xff1a; 在 Windows/Linux 上&#xff0c;可以通过点击…
阅读更多...
Windows系统编程项目（四）窗口管理器

Windows系统编程项目（四）窗口管理器

本章我们讲解基于对话框的MFC窗口相关的操作 该管理器要实现以下功能 初始化列表 初始化列表表头 初始化图像列表 初始化列表 功能实现 加载菜单 刷新列表 结束进程 隐藏窗口 最大化窗口 最小化窗口 手搓窗口管理器 // CWindowManage.cpp: 实现文件 //#include "pch.h&…
阅读更多...
优化 NFS 挂载参数以提升可靠性与容错性

优化 NFS 挂载参数以提升可靠性与容错性

在现代 IT 基础设施中&#xff0c;NFS&#xff08;网络文件系统&#xff09;被广泛用于共享文件和存储。虽然 NFS 提供了便利&#xff0c;但在某些情况下&#xff0c;挂载失败或网络问题可能导致挂载操作不稳定。为了提高挂载的可靠性和容错性&#xff0c;我们可以通过优化 NFS…
阅读更多...
JavaScript事件循环机制

JavaScript事件循环机制

JavaScript 事件循环机制&#xff08;Event Loop&#xff09;详解 JavaScript 是 单线程、非阻塞 语言&#xff0c;依赖 事件循环&#xff08;Event Loop&#xff09; 来实现异步编程。它的执行模型包括 调用栈&#xff08;Call Stack&#xff09;、任务队列&#xff08;Task …
阅读更多...
大模型架构记录4-文档切分 (chunks构建)

大模型架构记录4-文档切分 (chunks构建)

chunks&#xff1a; 块 trunks : 树干 “RAG”通常指 检索增强生成&#xff08;Retrieval-Augmented Generation&#xff09; 主要框架&#xff1a;用户提query&#xff0c;找到和它相关的&#xff0c;先把问题转换为向量&#xff0c;和向量数据库的数据做比较&#xff0c;检…
阅读更多...
物联网IoT系列之MQTT协议基础知识

物联网IoT系列之MQTT协议基础知识

文章目录 物联网IoT系列之MQTT协议基础知识物联网IoT是什么&#xff1f;什么是MQTT&#xff1f;为什么说MQTT是适用于物联网的协议&#xff1f;MQTT工作原理核心组件核心机制 MQTT工作流程1. 建立连接2. 发布和订阅3. 消息确认4. 断开连接 MQTT工作流程图MQTT在物联网中的应用 …
阅读更多...
idea 快捷键 Reformat code

idea 快捷键 Reformat code

Reformat code
阅读更多...
第27周JavaSpringboot电商进阶开发 1.企业级用户验证

第27周JavaSpringboot电商进阶开发 1.企业级用户验证

课程笔记&#xff1a;注册邮箱验证 一、概述 从本小节开始&#xff0c;将学习如何进行注册邮箱验证。主要任务是给项目配置一个公共邮箱&#xff08;可自己注册或由公司提供&#xff09;&#xff0c;用于向用户发送验证码&#xff0c;帮助用户完成注册流程。课程中以QQ邮箱为…
阅读更多...
数据库---sqlite3

数据库---sqlite3

数据库&#xff1a; 数据库文件与普通文件区别: 1.普通文件对数据管理(增删改查)效率低 2.数据库对数据管理效率高,使用方便 常用数据库: 1.关系型数据库: 将复杂的数据结构简化为二维表格形式 大型:Oracle、DB2 中型:MySql、SQLServer …
阅读更多...
音视频软件工程师面试题

音视频软件工程师面试题

一、基础知识 编解码相关 H.264 和 H.265（HEVC）的主要区别是什么？视频编解码的基本流程是什么？关键技术有哪些？音频编解码（如 AAC、MP3、Opus）的区别和应用场景？什么是 B 帧、P 帧、I 帧？它们的作用是什么？ 流媒体协议RTMP、HTTP-FLV、HLS、WebRTC 的区别和应用场景…
阅读更多...
【系统架构设计师】测试方法

【系统架构设计师】测试方法

目录 1. 说明2. 静态测试3. 动态测试4. 黑盒测试5. 白盒测试6. 灰盒测试7. 自动化测试8.例题8.1 例题1 1. 说明 1.软件测试方法的分类有很多种&#xff0c;以测试过程中程序执行状态为依据可分为静态测试&#xff08;Static Testing&#xff0c;ST&#xff09;和动态测试&…
阅读更多...
tomcat配置应用----server.xml文件具体配置

tomcat配置应用----server.xml文件具体配置

1.tomcat项目目录 默认项目目录&#xff1a;tomcat安装目录/webapps目录 如上图所示&#xff0c;在tomcat的项目目录下有很多子文件夹&#xff0c;这些子文件夹中都有一个项目首页。 如上图所示&#xff0c;将来我们去使用IP加端口号的方式去访问tomcat的时候&#xff0c;默认是…
阅读更多...
Spring Boot 调用DeepSeek API的详细教程

Spring Boot 调用DeepSeek API的详细教程

目录 前置准备步骤1&#xff1a;创建Spring Boot项目步骤2&#xff1a;配置API参数步骤3&#xff1a;创建请求/响应DTO步骤4&#xff1a;实现API客户端步骤5&#xff1a;创建控制器步骤6&#xff1a;异常处理步骤7&#xff1a;测试验证单元测试示例Postman测试请求 常见问题排查…
阅读更多...
多维数据聚合方案：SQL GROUPING SETS深度解析

多维数据聚合方案：SQL GROUPING SETS深度解析

一、什么是GROUPING SETS&#xff1f; GROUPING SETS是SQL标准中的多维聚合运算符&#xff0c;允许在单个查询中实现多维度组合的分组统计。相较于传统UNION ALL方案&#xff0c;性能可提升3-10倍&#xff08;TPC-DS基准测试&#xff09;。 二、核心语法解析 SELECT column1,…
阅读更多...
Excel中国式排名，3种方法！

Excel中国式排名，3种方法！

大家好&#xff0c;我是小鱼。 什么是中国式排名呢&#xff1f; 举个例子比如说公司一共有10名员工进行成绩考核&#xff0c;如果9个人考核成绩都是90分&#xff0c;你是89分&#xff0c;按照国际惯用的排名法则&#xff1a;9 个人考核成绩并列第一&#xff0c;你第10名&…
阅读更多...
最新文章

Copyright @ 2022~2023