参考官网http://www.lodop.net/demo.html
<!DOCTYPE>
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
function webPreview(){
//动态创建
var LODOP=getLodop();
LODOP.PRINT_INIT("打印任务名");
LODOP.SET_PRINT_PAGESIZE(1,0,0,"A4");
var htm = document.getElementById('tabinfo').innerHTML;
console.log(htm);
LODOP.ADD_PRINT_TABLE(0,0,"100%","100%",htm);
LODOP.SET_PREVIEW_WINDOW(0,0,0,800,600,"");
LODOP.PREVIEW();
}
</script>
<button type="button" οnclick="webPreview()" >打印预览</button>
<script language="javascript" src="js/LodopFuncs.js"></script>
<div id="tabinfo" >
<table border="1px" bordercolor="#d3d3d3" style="width:100%;border-collapse:collapse;border:1px #d3d3d3 solid;" >
<tr>
<td colspan="4" style="text-align:center;padding:8px;" >学生登记表</td>
</tr>
<tr>
<td style="text-align:center;padding:8px;" >姓名</td>
<td style="text-align:center;padding:8px;" >性别</td>
<td style="text-align:center;padding:8px;" >年龄</td>
<td style="text-align:center;padding:8px;" >出生日期</td>
</tr>
<tr>
<td style="text-align:center;padding:8px;" >姓名</td>
<td style="text-align:center;padding:8px;" >性别</td>
<td style="text-align:center;padding:8px;" >年龄</td>
<td style="text-align:center;padding:8px;" >出生日期</td>
</tr>
<tr>
<td style="text-align:center;padding:8px;" >姓名</td>
<td style="text-align:center;padding:8px;" >性别</td>
<td style="text-align:center;padding:8px;" >年龄</td>
<td style="text-align:center;padding:8px;" >出生日期</td>
</tr>
<tr>
<td style="text-align:center;padding:8px;" >姓名</td>
<td style="text-align:center;padding:8px;" >性别</td>
<td style="text-align:center;padding:8px;" >年龄</td>
<td style="text-align:center;padding:8px;" >出生日期</td>
</tr>
</table>
</div>
</body>
</html>