logo标签列表

在窗口打印之前执行函数

javascript
10

我有一个页面，在页面底部调用了 window.print();。我无法访问 window.print() 周围的代码，因为这些代码是由服务器生成的，我无法修改它们。由于 IE 的原因，在打印对话框出现之前，我需要在页面加载完成后执行一段 JavaScript 代码。但是，由于一旦执行到 window.print(); 就会直接弹出打印对话框，所以我无法实现这个功能。我仍然需要打印，但是首先需要运行 myFunction()，然后才能执行 window.print();

<html><head></head><body></body><!--no access from here--><script>window.print();</script></html>
5个回答
24

你应该可以这样覆盖它...

var _print = window.print;
window.print = function() {
  alert("Hi!");
  // do stuff
  _print();
}
我本来以为我试过那个了。不过那个完美地运行了！谢谢！ - joe
1
@Josh：他还需要等5分钟才能做到 :-) - Andy E
10
请注意，在Chrome 8和其他浏览器中，使用“文件·打印”或从浏览器工具栏执行打印操作（而非页面脚本）不会调用window.print，因此该代码将不会执行。测试案例：http://dl.dropbox.com/u/105727/web/print_function.html - Alan H.
1
@AlanH。在Chrome中使用Ctrl+P进行了测试，我批准它不起作用。 - skmasq
大家好。当直接从浏览器文件中打印时，这段代码如何也显示“Hi！”。请问有人可以指点我正确的方向吗？ - webs
显示剩余2条评论
10

"基本上是由于IE的原因，我需要..."

如果你只需要支持IE，则可以查看onbeforeprint事件。

window.onbeforeprint = function () {
    // some code    
}

这里的好处是，代码将不会在不支持onbeforeprint的浏览器中运行，除了IE之外几乎所有浏览器都不支持。

2

这个函数适用于所有浏览器，包括IE，无论如何调用打印功能：

/**
* Adds listeners for crossbrowser print callback
* @param callback - callback function
*/
function onPrint(callback) {
    window.matchMedia('print').addListener(query => query.matches ? callback() : null)
    window.addEventListener('beforeprint', () => callback())
}

onPrint(() => console.log('printing!'))

请注意，根据浏览器的不同，它可能会运行回调函数两次。这可以通过使用临时标志来避免。

0

尝试在你无法访问的那个 <script> 标签之前放置另一个标签，例如：

<html><head></head><body></body><script>alert('Hello There !');</script><script>window.print();</script></html>
0

一种更清晰、更现代的处理方式：

window.addEventListener('beforeprint', () => {
    // before print, do something
});
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接