javascript 打印功能在 chrome 中不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/29826909/
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
Print function not working in chrome
提问by Gaurav Manral
I have a print() function in my website which is used to print specific part of the website. It's working fine on Firefox
and even on Internet explorer
but is not working on chrome. It opens the dialog window and get the page counts too, but unable to get the content (in chrome).
我的网站中有一个 print() 函数,用于打印网站的特定部分。它在Firefox
甚至Internet explorer
在 Chrome上运行良好,但不适用于 chrome。它打开对话框窗口并获取页面计数,但无法获取内容(在 chrome 中)。
my code is below:
我的代码如下:
<a href="#" onclick="PrintElem('#press_releas11')"><img src="images/print_icon.png" width="35" height="23" /></a>
<div class="blog_post" id="press_releas11">
<div class="post_title"><h3>title here</h3></div>
<div class="post_article">content here</div>
</div>
script:
脚本:
<script type="text/javascript">
function PrintElem(elem)
{
Popup($(elem).html());
}
function Popup(data)
{
var mywindow = window.open('', 'my div', 'height=400,width=600');
mywindow.document.write('<html><head><title>PressReleases</title>');
mywindow.document.write('<link rel="stylesheet" href="css/main.css" type="text/css" />');
mywindow.document.write('</head><body >');
mywindow.document.write(data);
mywindow.document.write('data');
mywindow.document.write('</body></html>');
mywindow.document.close(); // necessary for IE >= 10
mywindow.focus(); // necessary for IE >= 10
mywindow.print();
mywindow.close();
return true;
}
</script>
回答by Constantin Gro?
It seems that Chrome doesn't like the document.write()
. It helped to add a setTimeout
of 1000ms after writing to the document and then calling mywindow.print()
, but as that's not very practical and you already seem to be using jQuery, here's a working solution:
Chrome 似乎不喜欢document.write()
. 它有助于setTimeout
在写入文档然后调用之后添加1000 毫秒mywindow.print()
,但由于这不是很实用,而且您似乎已经在使用 jQuery,这里有一个可行的解决方案:
https://jsfiddle.net/2n88pxee/
https://jsfiddle.net/2n88pxee/
Works in Chrome and Firefox, I haven't tried all other browsers, however.
可以在 Chrome 和 Firefox 中使用,但是我还没有尝试过所有其他浏览器。
Edit: and here's the code as requested in the comments
编辑:这是评论中要求的代码
function PrintElem(elem)
{
Popup($(elem).html());
}
function Popup(data)
{
var mywindow = window.open('', 'my div', 'height=400,width=600');
mywindow.document.head.innerHTML = '<title>PressReleases</title><link rel="stylesheet" href="css/main.css" type="text/css" />';
mywindow.document.body.innerHTML = '<body>' + data + '</body>';
mywindow.document.close();
mywindow.focus(); // necessary for IE >= 10
mywindow.print();
mywindow.close();
return true;
}
回答by Dr.Molle
The issue seems to be the embedded stylesheet, it has to be "downloaded", what takes some time, you try to print before the document is complete.
问题似乎是嵌入的样式表,它必须“下载”,这需要一些时间,您尝试在文档完成之前打印。
For me it works when I start printing when the readystate
of the document is complete
对我来说,当我开始打印readystate
文档时它起作用complete
function Popup(data)
{
var mywindow = window.open('', 'mydiv', 'height=400,width=600');
mywindow.document.open();
mywindow.document.onreadystatechange=function(){
if(this.readyState==='complete'){
this.onreadystatechange=function(){};
mywindow.focus();
mywindow.print();
mywindow.close();
}
}
mywindow.document.write('<html><head><title>PressReleases</title>');
mywindow.document.write('<link rel="stylesheet" href="css/main.css" type="text/css" />');
mywindow.document.write('</head><body >');
mywindow.document.write(data);
mywindow.document.write('data');
mywindow.document.write('</body></html>');
mywindow.document.close(); // necessary for IE >= 10
return true;
}
回答by Katharine Osborne
After using document.write, you need to use document.close. Then use a setInterval/clearInterval to watch when the document is finished writing. Tested in Chrome on Mac:
使用document.write后,需要使用document.close。然后使用 setInterval/clearInterval 来观察文档何时完成写入。在 Mac 上的 Chrome 中测试:
function Popup(data)
{
var mywindow = window.open('', 'my div', 'height=400,width=600');
mywindow.document.write('<html><head><title>PressReleases</title>');
mywindow.document.write('<link rel="stylesheet" href="css/main.css" type="text/css" />');
mywindow.document.write('</head><body >');
mywindow.document.write(data);
mywindow.document.write('data');
mywindow.document.write('</body></html>');
mywindow.document.close(); // necessary for IE >= 10
myDelay = setInterval(checkReadyState, 10);
function checkReadyState() {
if (mywindow.document.readyState == "complete") {
clearInterval(myDelay);
mywindow.focus(); // necessary for IE >= 10
mywindow.print();
mywindow.close();
}
}
return true;
}
回答by Mohammad Musavi
As it was mentioned among answers, it has something to do with seconds, so I used setTimeout() like this:
正如答案中提到的,它与秒有关,所以我像这样使用 setTimeout() :
var mywindow = window.open('', 'PRINT', 'height=5100,width=1086');
mywindow.document.write('<html><head><title>' + document.title + '</title>');
mywindow.document.write('<link rel="stylesheet" href="App_Themes/Basic/Share/Workflow.css" type="text/css" />');
mywindow.document.write('</head><body >');
mywindow.document.write("SomeData");
mywindow.document.close(); // necessary for IE >= 10
mywindow.focus(); // necessary for IE >= 10*/
setTimeout(function(){ mywindow.print(); mywindow.close();}, 2000);
回答by Elaine
For those who could have a chance of the same issue I got. I decided to add this as an answer rather than a comment.
对于那些可能有机会遇到我遇到的同样问题的人。我决定将此添加为答案而不是评论。
I tried all the above ways and it's still there even in IE works. Then I tried to just Ctrl+P here (on any website), the "print preview..." was still stuck there. So I realized this is not my program issue (or at least at that moment). So I switched Chrome printer to other one (like "Save to PDF"), and then switch back to "Print to PDF", it works....
我尝试了上述所有方法,即使在 IE 工作中它仍然存在。然后我尝试在此处(在任何网站上)按 Ctrl+P,“打印预览...”仍然卡在那里。所以我意识到这不是我的程序问题(或者至少在那一刻)。因此,我将 Chrome 打印机切换到其他打印机(例如“保存为 PDF”),然后切换回“打印为 PDF”,它可以工作....
No idea why it's suddenly abnormal.
不知道为什么突然就异常了。