css样式
/*打印*/
@media print {
@page {
margin: 0;
}
body {
margin: 1cm;
}
}
页面代码
<!--startprint-->
<div class="returnSearch">
<table align="center" cellpading="0" cellspacing="1" class="table_border" height="100%" id="table1" width="100%" border="1" bordercolor="#000" style="border-collapse: collapse;">
<tbody>
<tr>
<td align="center" bgcolor="#ffffff" class="table_bg">
阶段
</td>
<td align="center" bgcolor="#ffffff" class="table_bg">
主要工作措施
</td>
</tr>
<tr>
<td align="center" bgcolor="#ffffff" class="table_bg">
第一季度
</td>
<td bgcolor="#ffffff" class="table_bg">
<textarea style="background-color:#b5e3de;width:100%;" rows="4" name="f_milestone_1" validate=""></textarea>
</td>
</tr>
<tr>
<td align="center" bgcolor="#ffffff" class="table_bg">
第二季度
</td>
<td bgcolor="#ffffff" class="table_bg">
<textarea style="background-color:#b5e3de;width:100%;" rows="4" name="f_milestone_2" validate=""></textarea>
</td>
</tr>
</tbody>
</table>
</div>
<!--endprint-->
说明: 为打印开头标识 打印结束标识
<button type="button" id="printDetails">打印详情</button>
js 代码
// 打印详情
$(document).on('click','#printDetails',function () {
printHtml();
})
function printHtml() {
var bdhtml=window.document.body.innerHTML; //获取当前页的html代码
var sprnstr="<!--startprint-->"; //设置打印开始区域
var eprnstr="<!--endprint-->"; //设置打印结束区域
var prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17); //从开始代码向后取html
var prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr)); //从结束代码向前取html
window.document.body.innerHTML=prnhtml;
window.print();
window.document.body.innerHTML=bdhtml; //还原页面
}