how to detect window.print() finish

2019-01-02 17:57发布

站内问答 / JavaScript
1336 12 5

In my application, I tried to print out a voucher page for user, I used:

  var htm ="<div>Voucher Details</div>";
  $('#divprint').html(htm);
  window.setTimeout('window.print()',2000);

'divprint' is a div in my page which store information about the voucher.

It works, and the print page pops up. But I want to further proceed the application once user click 'print' or 'close' the pop up window.

for example, I'd like to redirect user to another page after pop up window is closed:

window.application.directtoantherpage();//a function which direct user to other page

How to determine the pop up print window is closed or print is finished?

12条回答
后来的你喜欢了谁
2楼-- · 2019-01-02 18:20

In FireFox and Internet Explorer you can listen for the after print event.

https://developer.mozilla.org/en-US/docs/Web/API/window.onafterprint

window.onafterprint = function(){
   console.log("Printing completed...");
}

It may be possible to use window.matchMedia to get this functiionality in other browsers.

(function() {

    var beforePrint = function() {
        console.log('Functionality to run before printing.');
    };

    var afterPrint = function() {
        console.log('Functionality to run after printing');
    };

    if (window.matchMedia) {
        var mediaQueryList = window.matchMedia('print');
        mediaQueryList.addListener(function(mql) {
            if (mql.matches) {
                beforePrint();
            } else {
                afterPrint();
            }
        });
    }

    window.onbeforeprint = beforePrint;
    window.onafterprint = afterPrint;

}());

Source: http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/

查看更多
0人赞 添加讨论(0) 举报
春风洒进眼中
3楼-- · 2019-01-02 18:21

See https://stackoverflow.com/a/15662720/687315. As a workaround, you can listen for the afterPrint event on the window (Firefox and IE) and listen for mouse movement on the document (indicating that the user has closed the print dialog and returned to the page) after the window.mediaMatch API indicates that the media no longer matches "print" (Firefox and Chrome).

Keep in mind that the user may or may not have actually printed the document. Also, if you call window.print() too often in Chrome, the user may not have even been prompted to print.

查看更多
0人赞 添加讨论(0) 举报
后来的你喜欢了谁
4楼-- · 2019-01-02 18:26

Tested IE, FF, Chrome and works in all.

    setTimeout(function () { window.print(); }, 500);
    window.onfocus = function () { setTimeout(function () { window.close(); }, 500); }
查看更多
0人赞 添加讨论(0) 举报
高级女魔头
5楼-- · 2019-01-02 18:26

On Chrome 41.0.. I have to put this

I print automatically on load page:

<body style="background-color:white;" onload="print_window();">

JS:

function print_window(){
  window.print();
  setTimeout(function () { 
    window.open('', '_self', '');
    window.close();
  }, 100);
}

It works too for IE 10

查看更多
0人赞 添加讨论(0) 举报
大哥的爱人
6楼-- · 2019-01-02 18:28

window.print behaves synchronously on chrome .. try this in your console

window.print();
console.log("printed");

"printed" doesn't display unless the print dialog is closed(canceled/saved/printed) by the user.

Here is a more detailed explanation about this issue.

I am not sure about IE or Firefox will check and update that later

查看更多
0人赞 添加讨论(0) 举报
临风纵饮
7楼-- · 2019-01-02 18:30

On chrome (V.35.0.1916.153 m) Try this:

function loadPrint() {
    window.print();
    setTimeout(function () { window.close(); }, 100);
}

Works great for me. It will close window after user finished working on printing dialog.

查看更多
0人赞 添加讨论(0) 举报
1 2 下一页
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)