html页面:
<div class="modal fade" id="viewModal" tabindex="-3" role="dialog" >
<div class="modal-dialog" role="document">
<div class="modal-content" style=" 260%; margin-left: -82%;">
<div class="modal-header">
<div id="UseForPrint" style="display:none">
<h2>供应商资格审查表</h2>
<table class="table cent" style="100%">
<caption class="printXM" style="font-size: 18px;"></caption>
<thead>
<tr>
<th>序号</th>
<th>供应商</th>
<th>审查结果</th>
</tr>
</thead>
<tbody class="addTd2">
</tbody>
</table>
</div>
<div class="text-center">
<button type="button" class="btn btn-primary" onclick="printpage()">打印资格审查结果</button>
</div>
</div>
<div class="modal-footer">
<div class="btn btn-default" data-dismiss="modal">关闭</div>
</div>
</div>
</div>
</div>
html 页面 的 class="modal-body 可以 设置一些样式,控制内容,
js:
通过事件把上面的 modal 弹出,$("#popPrintSheet").modal();
这个页面上也可以增加一个 打印的按钮直触发输内容;
下面的是 打印方法:
var printpage = function (){
var printHtml = $("#UseForPrint").html();
var wind = window.open("", "newwin", "toolbar=no,scrollbars=yes,menubar=no");
var ss = "<style>"
+"#UseForPrint{860px}"
+".coversheet-pageBoder{"
+" padding: 10px;"
+" margin-top: 10px;"
+" border: 1px solid gray;"
+" page-break-after: always;"
+" border-radius: 5px;"
+" box-shadow: 0 1px 2px 1px rgba(0,0,0,.08), 0 3px 6px rgba(0,0,0,.08);"
+"}"
+".noprint{display: none;}"
+".cent tr{height: 40px;"
+"line-height: 40px;"
+"text-align: center;"
+"100%}"
+"</style>";
printHtml = ss + printHtml;
wind.document.body.innerHTML = printHtml;
wind.print();
wind.close();
}
mydiv 输出内容的div
ss可以增加一些样式 控制弹出页面;
wind.close() 最好是加上,可以控制打印窗口关闭后 直接 关闭新打开的窗口。