html实现打印预览效果
- 格式:pdf
- 大小:205.94 KB
- 文档页数:2
html实现打印预览效果
前⾯说到利⽤lodop插件进⾏打印设置,那个应⽤于打印快递⾯单,或者跟快递⾯单相似场景的情况。
今天的利⽤html快速打印出A4纸⼤⼩的场景,例如:合同、静态⽂本等。效果如下:
⽅式⼀
1、设置div,打印区域,最好是单放在⼀页,因为需要打印的是该页所有内容
2、拼接div中需要的⽂本,可以设置动态数据填充
var contractContent = '';
contractContent += '
contractContent +=
'html打印合同 编号: DxWL-0017722 ';
contractContent += '
contractContent += '
contractContent += '';
contractContent += '
contractContent += '
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '托运⽅(以下简称甲⽅)';
contractContent += '';
contractContent += '';
contractContent += '单位名称';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '单位地址';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '公司电话';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '起运地点';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '⽬的地';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '联系电话';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '承运⽅(以下简称⼄⽅)';
contractContent += '';
contractContent += '';
contractContent += '车牌号';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '⾏驶证所有⼈';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '车型';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '驾驶员姓名';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '⾝份证号';
contractContent += '';
contractContent += '';
contractContent += '';
contractContent += '联系电话';