C-LODOP
Lodop 是专业WEB控件,用它既可裁剪输出页面内容，又可用程序代码直接实现复杂打印。控件功能强大,却简单易用,所有调用如同 JavaScript 扩展语句。
简单使用：
var pageBreakJs = '<script src="/js/page_break/v1.0/index.js"></script>';
var strStyleCSS += '<style>.test{background-color:red}</style>';
strStyleCSS += '<link href="test.css" rel="stylesheet">';
var LODOP = getLodop();
LODOP.PRINT_INIT('');
LODOP.ADD_PRINT_HTM(0, 0, "100%", "100%", '<!DOCTYPE html><head>' + strStyleCSS + "</head><body style='background-color: #ffffff;overflow:hidden;'>" + printHTML + pageBreakJs + "</body></html>");
LODOP.PREVIEW('');
通过使用 ADD_PRINT_HTM 方法，可以传入 HTML 内容 、 CSS 、 JS，CLODOP 插件内部会调用本机默认 ie 内核进行渲染，其渲染的结果将作为最终输出，其本质和浏览器一样，所以也可以运行 javascript 脚本。为了应对不同客户端电脑不同 ie 版本，需要对低版本 ie 内核进行兼容。
注意事项：
- 如果需要在 ADD_PRINT_HTM 种执行脚本或者使用自定义样式，最好使用内联脚本和内联样式，在 win7 或者 xp 系统中，加载外部文件会消耗大量CPU资源，可能会造成预览框弹不出（不知道是电脑配置问题还是插件的bug）。
- 使用 ADD_PRINT_HTM 打印 HTML 内容不能进行很好的自动分页，在页面底部如果刚好有文字，文字可能被截掉一半，解决这种问题，目前只能手动进行强制换行，或者加入脚本动态计算，如下：
//css:.break_page{page-break-after:always} //以下代码需要添加到 ADD_PRINT_HTM 的内容中 (function() { var doms = _getByClass('count_height'); //需要事先给不能分页的元素添加'count_height'类 //获取打印机纸张高度 var windowHeight = window.innerHeight || document.documentElement.clientHeight; var countHeight = 0; for (var i = 0; i < doms.length; i++) { //计算元素所占的高度 var height = doms[i].scrollHeight + _getMargin(doms[i], 'marginTop') + _getMargin(doms[i], 'marginBottom'); countHeight += height; if (countHeight + 50 > windowHeight) { //该元素正好在分页部位，则强制到下一页显示 if (i > 1) { doms[i - 1].className = doms[i - 1].className + ' break_page' } countHeight = height % windowHeight; } } //获取边距 function _getMargin(dom, prop) { if (window.getComputedStyle) { return _pxToNum(window.getComputedStyle(dom, null)[prop]); } else { return _pxToNum(dom.currentStyle[prop]); } } //去掉px单位 function _pxToNum(px) { return parseInt(px.substring(0, px.length - 2)) || 0 } //兼容ie6 function _getByClass(name) { //如果浏览器支持 会得到一个函数体 if (document.getElementsByClassName) { return document.getElementsByClassName(name); } //把所有的元素获取到 var allItems = document.getElementsByTagName("div"); var newArr = []; //查找每一个元素的className 看其中含不含name for (var i = 0; i < allItems.length; i++) { var classNames = allItems[i].className; //"test test11" var arrClass = classNames.split(" "); for (var j = 0; j < arrClass.length; j++) { if (arrClass[j] == name) { newArr.push(allItems[i]); } } } return newArr; } })();