lodop的介绍

1. 功能丰富：LODOP 允许网页中进行高度自定义的打印操作，包括添加文本、图像、表格等内容，设置纸张尺寸和方向，调整对象的风格和布局，控制打印机的设置等

2. HTML 内容支持：LODOP 支持添加 HTML 内容到打印任务中，可以通过 ADD_PRINT_HTM 方法将 HTML 代码呈现为打印内容，可以灵活地处理复杂的格式和布局需求

3. 对象风格控制：通过 SET_PRINT_STYLE 方法，可以为打印任务中的对象（如文本、图像、表格等）设置各种风格，包括字体大小、字体名称、加粗、对齐方式、边框样式等，从而实现个性化的打印效果

4. 灵活的打印设置：LODOP 提供了丰富的打印设置选项，可以控制打印纸张的尺寸、方向和页眉页脚等内容，还可以调整打印机的设置，如纸张类型、打印机名称、打印份数等

5. 跨浏览器兼容性：LODOP 支持多种浏览器，包括 Internet Explorer、Chrome、Firefox 等，以及不同版本的浏览器，能够在各种环境下进行打印操作

在页面内嵌入lodop

方法一

通常情况下，在页面中嵌入 Lodop 如下引用代码，然后用一个全局对象变量来使用控件，在 head 或 body 中加入：

<script src="LodopFuncs.js"></script>
<object  id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0> 
       <embed id="LODOP_EM" type="application/x-print-lodop" width=0 height=0></embed>
</object>

在调用 Lodop 功能前，先用如下 JS 过程获得控件对象：

var LODOP=getLodop(document.getElementById('LODOP_OB'),document.getElementById('LODOP_EM'))

当页面不添加以上代码时，getLodop 过程会动态建立它们，语句简化如下(推荐)：

var LODOP=getLodop()

方法二

我是用的这种方法，因为这种方法可以让你更快的在 html 页面集成 lodop

只需要下载 部署 C-Lodop 和加一行代码就行了

<script src="http://localhost:8000/CLodopFuncs.js"></script>

有了这个 C-Lodop 的快捷方式你就可以打印了

lodop的API

我就来讲讲几个常用的 API 吧

PRINT_INIT(strPrintTaskName)

打印初始化，参数就一个字符串，随便你怎么写

LODOP.PRINT_INIT('PrintTask')

SET_PRINT_PAGESIZE(intOrient,intPageWidth,intPageHeight,strPageName)

intOrient：表示打印纸张的方向，它可以取以下值：

• 1：纵向打印（默认值）
• 2：横向打印

intPageWidth：表示打印纸张的宽度，单位为毫米（mm）

intPageHeight：表示打印纸张的高度，单位为毫米（mm）

strPageName：表示打印纸张的名称，可以用于标识该纸张的类型或用途。这是一个可选参数

因为我这里的是要打印出半张 a4 纸，所以我就写的 a5

LODOP.SET_PRINT_PAGESIZE(1, 0, 0, 'A5')

ADD_PRINT_HTM(intTop,intLeft,intWidth,intHeight,strHtml)

intTop：表示超文本项的上边距，即距离纸张顶部的距离，单位为毫米（mm）

intLeft：表示超文本项的左边距，即距离纸张左侧的距离，单位为毫米（mm）

intWidth：表示超文本项的宽度，单位为毫米（mm）

intHeight：表示超文本项的高度，单位为毫米（mm）

strHtml：表示要打印的 HTML 内容，可以是一个完整的 HTML 代码字符串

我一般都用这个写标题，因为可以直接用标签

LODOP.ADD_PRINT_HTM(startY, 370, 290, rowHeight, '<b style="fount-size: 20px;">送货清单<b>')

ADD_PRINT_TEXT(intTop,intLeft,intWidth,intHeight,strContent)

intTop：表示纯文本项的上边距，即距离纸张顶部的距离，单位为毫米（mm）

intLeft：表示纯文本项的左边距，即距离纸张左侧的距离，单位为毫（mm）

intWidth：表示纯文本项的宽度，单位为毫米（mm）

intHeight：表示纯文本项的高度，单位为毫米（mm）

strContent：表示要打印的纯文本内容，即要在纸张上显示的文本字符串

这个就像 html 里面的 div 或者是 span 标签，就是显示文本的

LODOP.ADD_PRINT_TEXT(startY, startX, 250, rowHeight, '收货方: ')

ADD_PRINT_TABLE(intTop,intLeft,intWidth,intHeight,strHtml)

intTop：表示表格项的上边距，即距离纸张顶部的距离，单位为毫米（mm）

intLeft：表示表格项的左边距，即距离纸张左侧的距离，单位为毫米（mm）

intWidth：表示表格项的宽度，单位为毫米（mm）

intHeight：表示表格项的高度，单位为毫米（mm）

strHtml：表示要打印的表格的 HTML 内容，可以是一个完整的 HTML 表格代码字符串

我一般用这个来写表格，它的最后一个参数可以直接写 html

let tableHtml = `
              <table border="1" style="border-collapse:collapse;">
                <tr style="text-align: center;">
                  <td rowspan="2" width="50px">编号</td>
                  <td rowspan="2" width="120px">货位</td>
                  <td rowspan="2" width="120px">物料名称</td>
                  <td rowspan="2" width="120px">型号</td>
                  <td rowspan="2" width="120px">客户物料编码</td>
                  <td colspan="4" width="240px">产品规格</td>
                  <td rowspan="2" width="50px">数量</td>
                  <td rowspan="2" width="120px">备注</td>
                </tr>
                <tr style="text-align: center;">
                  <td>厚度</td>
                  <td>宽度</td>
                  <td>长度</td>
                  <td>卷数</td>
                </tr>
            `

LODOP.ADD_PRINT_TABLE(190, startX, 900, 600, tableHtml)

SET_PRINT_STYLE(strStyleName, varStyleValue)

• strStyleName：表示要设置的风格名称，可以是以下预定义的风格名称之一：
  • "FontSize"：字体大小
  • "FontName"：字体名称
  • "Bold"：是否加粗
  • "Italic"：是否斜体
  • "Underline"：是否下划线
  • "Alignment"：对齐方式
  • "LineSpacing"：行间距
  • "LineHeight"：行高
  • "TextRotation"：文本旋转角度
  • "TextColor"：文本颜色
  • "BackColor"：背景颜色
  • "BorderStyle"：边框样式
  • "BorderWidth"：边框宽度
  • "BorderColor"：边框颜色
  • "Padding"：内边距
  • "Margin"：外边距
• varStyleValue：表示要设置的风格值，具体取决于所设置的风格名称。可以是数值、字符串或布尔值，根据风格的不同而变化

LODOP.SET_PRINT_STYLE('FontSize', 8)

LODOP.PREVIEW()

这个就是打印预览，只要你装了 C-Lodop插件，就可以在电脑上面看打印的效果了

总结

varStyleValue`：表示要设置的风格值，具体取决于所设置的风格名称。可以是数值、字符串或布尔值，根据风格的不同而变化

LODOP.SET_PRINT_STYLE('FontSize', 8)

总结

总而言之，LODOP 是一个功能强大的打印控件，就像写 html、css 一样，通过它，可以在网页中实现高度自定义的打印功能，包括添加内容、设置样式、控制打印机设置等，满足各种打印需求