lodop打印技巧与注意事项 原

打印前的准备工作 首先用Html和css把完整的打印页面写出，注意需要输入内容的地方要用input输入框，

技术要点： 1、input的样式，由于input的默认样式每个浏览器显示不一样，既不美观也不统一，这里先统一input的样式 input[type="text"]{border:1px solid #ccc;padding-left:5px;height:20px;line-height:20px;} input:focus {border-color: #3c8dbc;box-shadow: none;outline: 0;} //以上样式为bootstrap的input 样式 2、打印预览的内容是input输入的内容，正常情况下，不管输入什么内容，打印预览的的内容都是input的初始value值，修改input的内容不改变html的value属性需要用js修改属性

 $('input:text').each(function(i,n){    this.setAttribute('value',this.value);   }   );

接着就要安装lodop插件，谷歌42版本以上的要安装c-lodop,通过打印设计把需要输出的文字，在打印设计里面把代码输出，黏贴到html页面如下 LODOP.ADD_PRINT_TEXT(211,489,81,20,"输出内容1"); 然后换成动态的输出内容 LODOP.ADD_PRINT_TEXT(211,489,81,20,document.getElementById("price").innerHTML); 

然后把打印设计改成打印预览LODOP.PREVIEW();也可以把页面微调的权限授权给客户，由于每台打印机不一样，客户可以自己微调页面的位置LODOP.PRINT_SETUP(); 

(adsbygoogle = window.adsbygoogle || []).push({});