无法通过afterprint监听iframe是否打印
时间: 2023-07-12 10:33:01 浏览: 181
确实,使用 `afterprint` 事件是无法监听到 iframe 中的打印事件的。因为 `afterprint` 事件只会在整个页面打印完成后触发,而不会在 iframe 中的打印完成后触发。因此,如果需要监听 iframe 中的打印事件,可以使用以下两种方法:
1. 监听 iframe 内部文档的 `beforeprint` 和 `afterprint` 事件。
```javascript
const iframe = document.getElementById('my-iframe');
const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
iframeDoc.addEventListener('beforeprint', () => {
console.log('文档开始打印');
});
iframeDoc.addEventListener('afterprint', () => {
console.log('文档打印完成');
});
```
2. 在 iframe 中的打印函数中手动触发自定义事件,然后在父页面中监听该事件。
在 iframe 中的打印函数中添加以下代码:
```javascript
window.dispatchEvent(new CustomEvent('printFinished'));
```
然后在父页面中监听该事件:
```javascript
const iframe = document.getElementById('my-iframe');
iframe.addEventListener('printFinished', () => {
console.log('文档打印完成');
});
```
这样,当在 iframe 中触发了 `printFinished` 事件时,就会在父页面中执行相应的代码,从而实现了监听 iframe 中的打印事件的目的。
阅读全文