javascript Chrome 中的打印功能不再有效

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18240001/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 11:10:10  来源:igfitidea点击:

Print function in Chrome no longer working

javascriptgoogle-chromewindow.open

提问by Jeffrey Simon

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.

我们的网站有一个功能,可以打印会员资料。它的工作方式是通过 onsubmit 将 javascript 函数附加到按钮。javascript 函数使用 window.open 以特殊模式重新打开页面,重新显示页面的打印机友好版本。

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.

此功能自 2008 年左右就已存在,适用于所有浏览器。除了大约一周前,它已停止在 Chrome 中工作。使用 Chrome 时,所发生的情况是打开的窗口确实打开了,但随后又短暂地打开了另一个空白窗口,然后所有窗口都关闭了。

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:

这是 onsubmit 的样子:

<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():

虽然没有必要查看,但这里是整个 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 标签中添加了以下内容:

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

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

如上所述,该功能在 IE 和 Firefox 中继续有效。只有 Chrome 有这个问题。

Any ideas?

有任何想法吗?

回答by LumberHyman

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

按钮和 window.open 确实与您的问题无关。

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.

问题是,Chrome 在打印之前正在寻找用户输入。Window.print() 打开打印对话框窗口,但 Chrome 不会等待您完成打印。window.close() 正在关闭打印对话框窗口以及父级中的所有其他内容。

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:

为了节省您的时间,请注意 Chrome 根本不使用 OnAfterPrint 钩子。我还尝试将 window.close() 放在 onLoad 中,将 window.print() 放在 onBeforeUnload 中,但打印对话框取消了 window.close()。下一个最好的事情是做这样的事情:

//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.

我没有测试过这个,但我认为它相当有效地展示了这个想法。

回答by Mari

I found this solution and it really works:

我找到了这个解决方案,它确实有效:

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

回答by bresleveloper

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:

Chrome 速度如此之快,以至于它实际上在加载文档之前调用了打印。这就是为什么最好的办法就是将打印功能移动到 onload,像 Mari 或像这样:

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

并且 oc 它在 IE 中不起作用所以完整的代码应该是这样的

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

回答by Alaa.Kh

I use Mr.bresleveloper solution with some changes:

我使用 Mr.bresleveloper 解决方案进行了一些更改:

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();
}

回答by user12333815

//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.

谢谢。

回答by Jimmy

I also get the same problem with this methods

我也用这种方法遇到同样的问题

   window.print();
   window.close();

even recognizing the browser and then executing the code accordingly is good. But this is a very handy and short cut solution to fix this issue only by two line.

即使识别浏览器然后相应地执行代码也很好。但这是一个非常方便和快捷的解决方案,只需两行即可解决此问题。

   document.execCommand('print');
   window.close();

working perfectly fine in chromeand IE

chrome和 中工作得很好IE