这里我是新开窗口打印,会存在一个问题:就是不关闭打印窗口回到父页面,父页面不响应的情况
所以,我另外写了一个监听离开新开窗口,弹窗提示的函数,提示用户关闭打印窗口,方可进行后续操作
额,发现问题更大了,只要离开父页面就会弹窗。。。(因为监听的始终是父页面是否为浏览器当前页啊)
var canvas = document.getElementsByClassName('ol-unselectable')[0]; //待打印区域dom对象
var win = window.open();
win.document.write("<br><img src='" + canvas.toDataURL() + "'/>");
//保证加载完成
setTimeout(() => {
win.print();
}, 300);
currentPage('请确认打印窗口已经关闭,否则无法进行后续操作')
监听浏览器是否处于当前页面的函数
function currentPage(msg) {
var hiddenProperty = 'hidden' in document ? 'hidden' :
'webkitHidden' in document ? 'webkitHidden' :
'mozHidden' in document ? 'mozHidden' :
null;
var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');
var onVisibilityChange = function () {
if (!document[hiddenProperty]) {
console.log('页面激活');
return true
} else {
console.log('页面非激活')
alert(msg)
return false
}
}
document.addEventListener(visibilityChangeEvent, onVisibilityChange);
}
原本 打算这里打印用lodop控件,但是要装驱动,觉得用户体验不好