javascript 如何在谷歌浏览器中打印 pdf？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14274181/
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
How can i print a pdf in google chrome?
提问by The Dark Knight
I have a pdf associated with a button . When i click the button i want to get the pdf printed. This is how my button is coded :
我有一个与按钮相关联的 pdf 。当我单击按钮时，我想打印 pdf。这是我的按钮的编码方式：
<input type="submit" class="btn-red" value="Print"
name="Submit" id="printbtn"
onclick="printPDF('http://www.irs.gov/pub/irs-pdf/fw4.pdf')" />
Now my print functionality works like this :
现在我的打印功能是这样工作的：
function printPDF(pdfUrl)
{
if ((navigator.appName == 'Microsoft Internet Explorer') )
window.print(pdfUrl,"_self");
else
{
var w = window.open(pdfUrl,"_self");
w.print();
w.close();
}
}
The problem is , it's working fine in IE and Fire fox , but does not work in chrome. In ie and Firefox, it opens up the xps printer option, but in chrome , it just opens up a new print window, with the print preview of the div and not the pdf . But i want the xps option to be opened up here.
问题是，它在 IE 和 Fire fox 中运行良好，但在 chrome 中不起作用。在 ie 和 Firefox 中，它打开 xps 打印机选项，但在 chrome 中，它只打开一个新的打印窗口，带有 div 的打印预览，而不是 pdf 。但我希望在这里打开 xps 选项。
EDIT :In chrome when i try to print , only the html element comes as preview and not the pdf. I am using chrome version : 20.0.1132.57
编辑：在 chrome 中，当我尝试打印时，只有 html 元素作为预览而不是 pdf。我使用的是 chrome 版本：20.0.1132.57
How can i get around this peculiarity ? kindly help .
我怎样才能解决这个特殊性？请帮助。
采纳答案by BBog
I had to do the same thing and I used a different approach, one that for me worked in both Chrome and Firefox.
我不得不做同样的事情，我使用了一种不同的方法，一种对我来说在 Chrome 和 Firefox 中都可以使用的方法。
My solution involved a print.html helper file, that received the PDF file's url as a GET type parameter, then loaded the pdf inside an iframe. Then it kept checking to see if the pdf had completely loaded (binding the check to the onloadevent did not work) and on completion it triggered the print method.
我的解决方案涉及一个 print.html 帮助文件，它接收 PDF 文件的 url 作为 GET 类型参数，然后将 pdf 加载到 iframe 中。然后它不断检查pdf是否已完全加载（将检查绑定到onload事件不起作用）并在完成时触发打印方法。
Here:
这里：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>Print Page</title>
<meta name="title" content="Print" />
<script>
(function (window, document, undefined) {
var printy = {
urlGET: function (param) {
var params = document.URL.split('?');
if(params.length > 1) {
params = params[1].split('&');
for (var i = 0, len = params.length; i < len; i++) {
if (params[i].split('=')[0] === param) {
return params[i].split('=')[1];
}
}
}
return null;
},
init: function () {
var self = this;
window.onload = function () {
var src = self.urlGET('path');
//creating an iframe element
var ifr = document.createElement('iframe');
document.body.appendChild(ifr);
// making the iframe fill the viewport
ifr.width = '100%';
ifr.height = window.innerHeight;
// continuously checking to see if the pdf file has been loaded
self.interval = setInterval(function () {
if (ifr.contentDocument.readyState === 'complete') {
clearInterval(self.interval);
// doing the actual printing
ifr.contentWindow.print();
}
}, 100);
ifr.src = src;
}
}
}
printy.init();
})(window, document, undefined);
</script>
</head>
<body>
</body>
</html>
This solution is not tested on IE though. We use Macs at work so it was not an option.
不过，此解决方案未在 IE 上进行测试。我们在工作中使用 Mac，所以这不是一种选择。
In order to do the printing, I use it by calling an URL like this: http://example.com/print.html?path=docs/myfile.pdf
为了进行打印，我通过调用这样的 URL 来使用它： http://example.com/print.html?path=docs/myfile.pdf
回答by Greg Ennis
This worked for me and didn't require a host HTML file. The key was to wait for onload:
这对我有用，不需要主机 HTML 文件。关键是等待加载：
For a link like this:
对于这样的链接：
<a class="print-pdf-link" href="/your/pdf.pdf">Print PDF</a>
I used javascript:
我使用了javascript：
$('a.print-pdf-link').click(function () {
var w = window.open($(this).attr('href'));
w.onload = function () {
w.print();
};
return false;
});
