最新消息:Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)

browser - execute javascript when printing page - Stack Overflow

matteradmin3PV0评论

when printing a page, the javascript code seems to be executed.
how can I determine, if the page is currently being printed? I do some js-resizing, and have to handle printing a little bit different.

when printing a page, the javascript code seems to be executed.
how can I determine, if the page is currently being printed? I do some js-resizing, and have to handle printing a little bit different.

Share asked Oct 4, 2011 at 7:38 Gerhard PresserGerhard Presser 4891 gold badge4 silver badges14 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 9

You can't, except for IE browsers. No other browser has a before print event. You can, however, target a specific stylesheet to only apply while printing:

<!-- In head -->
<link rel="stylesheet" type="text/css" media="print" href="print.css" />

This stylesheet will be applied before printing. This allows you to perform some amazing changes, including hiding major sections, moving items around, and performing print-only styling, such as page breaks.

Another option is to provide the user with a "Print this Page" button. That button can handle your JavaScript, call window.print(), and revert the changes:

function printMe() {
    // perform changes
    window.print();
    // revert changes
}

The window.print() method always blocks (in every browser I've tested), so it's safe to immediately revert the changes afterward. However, if the user choose to print via the menu or toolbar, you are out of luck.

One way I handled that case in a plex web-app was to have a print stylesheet that hid everything but a special DIV. If the user clicked print, they would get a warning message. If they clicked the print button, then that div would be populated with the correct information. It's not great, but at least they didn't get several pages of garbage.

AFAIK there is no general possibility. IE has onbeforeprint and onafterprint which are now added also to Firefox 5/6+ (I dont know for sure). Consider using print specific stylesheets

<link rel="stylesheet" href="print.css" type="text/css" media="print" /> 

Other relevant questions

  • onbeforeprint() and onafterprint() equivalent for non IE browsers (PHP, MySQL, JavaScript, HTML)
  • Trigger resize event on print
  • What event is fired when window.print() is called?
Post a comment

comment list (0)

  1. No comments so far