标签：打印 printHtml Bootstrap modal 跳转 var wind 页面

html页面：

<div class="modal fade" id="viewModal" tabindex="-3" role="dialog" >
<div class="modal-dialog" role="document">
<div class="modal-content" style="width: 260%; margin-left: -82%;">
<div class="modal-header">
<div id="UseForPrint" style="display:none">
<h2>供应商资格审查表</h2>
<table class="table cent" style="width: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{width: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;"
+"width:100%}"
+"</style>";

printHtml = ss + printHtml;
wind.document.body.innerHTML = printHtml;
wind.print();
wind.close();
}

mydiv 输出内容的div

ss可以增加一些样式 控制弹出页面；

 wind.close() 最好是加上，可以控制打印窗口关闭后 直接 关闭新打开的窗口。

标签：打印,printHtml,Bootstrap,modal,跳转,var,wind,页面
来源： https://www.cnblogs.com/Esther-yan/p/12983485.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。