Print events
The afterprint event is fired after the associated document has started printing or the print preview has been closed.
The beforeprint and afterprint events allow pages to change their content before printing starts (perhaps to remove a banner, for example) and then revert those changes after printing has completed. In general, you should prefer the use of a @media print CSS at-rule, but it may be necessary to use these events in some cases.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 63 | 12 | 6 | 13 | 63 | 13 | |
| The beforeprint event is fired when the associated document is about to be printed or previewed for printing. | 63 | 12 | 6 | 13 | 63 | 13 |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
JAVASCRIPT
window.addEventListener("afterprint", (event) => {
console.log("After print");
});Use cases
-
Using Print events
The afterprint event is fired after the associated document has started printing or the print preview has been closed.
Cautions
- May not be supported in older browsers.
Implementation notes
- Some APIs require a secure context (HTTPS) or user activation. Check the requirements before use.