引入JQ:<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
打印方法:
// 打印
function preview(){
bdhtml=window.document.body.innerHTML;//获取当前页的html代码
sprnstr="<!--startprint-->";//设置打印开始区域
eprnstr="<!--endprint-->";//设置打印结束区域
prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取html
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html
window.document.body.innerHTML=prnhtml;
window.print();
window.document.body.innerHTML=bdhtml;
}
html部分:
<button class="btn-online-printing" onclick="preview()">在线打印</button>
<!--startprint--> 打印开始位置
<div class="">
这里是打印的内容
</div>
<!--endprint--> 打印结束位置
提示:这个打印会出现重载页面的现象,页面上原有的功能在重载页面后会失效,
解决办法:监听打印回调然后重新刷新页面
代码如下:
// 浏览器打印回调
var beforePrint = function() {
location.reload()
};
// 浏览器打印回调
var afterPrint = function() {
location.reload()
};