Print function in Chrome no longer working

问题

Our website has a feature whereby a member profile can be printed. The way that it works is that a javascript function is attached to a button via an onsubmit. The javascript function uses a window.open to reopen the page in a special mode, which redisplays a printer-friendly version of the page.

This functionality has been in place since about 2008, and works in all browsers. Except about a week or so ago it has stopped working in Chrome. With Chrome, what happens is that the opened window does open, but then another blank window briefly opens, and then the all of them close.

In searching for discussion of this issue I was unable to find the exact issue, but did find something that said that a "return false" should be added to the onsubmit. I tried adding that but it did not help.

Here is what the onsubmit looks like:

<button onclick="PrintEmailSubmit('print');">Print Profile</button>

Here is what the code that opens the window looks like:

window.open('print-email-profile.php?mode=' + mode,'','width=' + width + ',height=' + height + ',scrollbars=yes,location=0,menubar=1,status=0,toolbar=0')

While it should not be necessary to see, here is the entire function PrintEmailSubmit():

/*
 *  called by view-profile.php
 */
function PrintEmailSubmit(mode)
{
    var width;
    var height;
    switch(mode)
    {
        case 'print':
            width = 850;
            height = 1000;
            break;

        case 'email':
            width = 400;
            height = 120;
            break;

        default:
            alert('Error: invalid calling sequence -- should not happen!');
            exit;
    }
    window.open('print-email-profile.php?mode=' + mode,'','width=' + width + ',height=' + height + ',scrollbars=yes,location=0,menubar=1,status=0,toolbar=0');
}

And finally, what makes this work is that the special version of the page has the following added to the body tag:

<body onload="window.print();window.close();">

As stated above, the function continues to work in IE and Firefox. Just Chrome is having this issue.

Any ideas?

回答1:

The button and the window.open really have nothing to do with your problem.

The problem is, Chrome is looking for user input before it prints. Window.print() opens the print dialog window, but Chrome isn't waiting for you to finish printing. The window.close() is closing the print dialog window and everything else in the parent.

In an effort to save you time, be aware that the OnAfterPrint hook isn't used by Chrome at all. I also tried putting window.close() in the onLoad and window.print() in the onBeforeUnload, but the print dialog cancels the window.close(). The next best thing would be to do something like:

//In your profile print page
<html>
<head>
<script>
var is_chrome = function () { return Boolean(window.chrome); }
if(is_chrome) 
{
   window.print();
   setTimeout(function(){window.close();}, 10000); 
   //give them 10 seconds to print, then close
}
else
{
   window.print();
   window.close();
}
</script>

<body onLoad="loadHandler();">

I haven't tested this, but I think it demonstrates the idea fairly effectively.

回答2:

I found this solution and it really works:

<body onload="window.print();window.onmouseover = function() { self.close(); } ">

回答3:

I use Mr.bresleveloper solution with some changes:

var is_chrome = Boolean(window.chrome);
if (is_chrome) {
    winPrint.onload = function () {
        setTimeout(function () { // wait until all resources loaded 
            winPrint.print();  // change window to winPrint
            winPrint.close();// change window to winPrint
        }, 200);
    };
}
else {
    winPrint.print();
    winPrint.close();
}

回答4:

The Chrome is so fast that it actually call the print before the document is loaded. That's why the best thing to do is just moving the print function to onload, either like Mari or like this:

winPrint = window.open("", "winPrint", "width=1,height=1");
winPrint.document.write(html);
winPrint.onload = function () {
    window.print();
    window.close();
};

And o.c. it's not working in IE so full code should look like this

var is_chrome = Boolean(window.chrome);
if (is_chrome) {
    winPrint.onload = function () {
        window.print();
        window.close();
    };
}
else {
    winPrint.print();
    winPrint.close();
}

回答5:

//In your profile print page
<html>
<head>
<script>
var is_chrome = function () { return Boolean(window.chrome); }
if(is_chrome) 
{
   window.print();
   setTimeout(function(){window.close();}, 10000); 
   //give them 10 seconds to print, then close
}
else
{
   window.print();
   window.close();
}
</script>

<body onLoad="loadHandler();">

This works fine.

Thanks.

来源：https://stackoverflow.com/questions/18240001/print-function-in-chrome-no-longer-working

标签

javascript

google-chrome

window.open