如何在Google Chrome中打印pdf?

时间:2013-01-11 08:20:57

标签: javascript

我有一个与按钮关联的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')" />

现在我的打印功能就像这样:

    function printPDF(pdfUrl)
    {

    if ((navigator.appName == 'Microsoft Internet Explorer') ) 
    window.print(pdfUrl,"_self");
    else
    {
    var w = window.open(pdfUrl,"_self");
    w.print();
    w.close();
    }
    }

问题是,它在IE和Fire fox中运行良好,但在chrome中不起作用。在ie和Firefox中,它打开了xps打印机选项,但是在chrome中,它只是打开一个新的打印窗口,带有div的打印预览,而不是pdf。但是我希望在这里打开xps选项。

编辑:当我尝试打印时,在chrome中,只有html元素作为预览而不是pdf。我使用的是chrome版本:20.0.1132.57

我怎样才能解决这个问题?请帮助。

2 个答案:

答案 0 :(得分:4)

我必须做同样的事情而且我使用了一种不同的方法,一种适用于Chrome和Firefox的方法。

我的解决方案涉及一个print.html帮助文件,它接收PDF文件的url作为GET类型参数,然后将pdf加载到iframe中。然后它继续检查pdf是否已完全加载(将检查绑定到onload事件不起作用),并在完成时触发打印方法。

下面:

<!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>

此解决方案尚未在IE上进行测试。我们在工作时使用Mac,因此不是一种选择。

为了进行打印,我通过调用这样的URL来使用它:http://example.com/print.html?path=docs/myfile.pdf

答案 1 :(得分:4)

这对我有用,并且不需要主机HTML文件。关键是要等待onload:

对于这样的链接:

<a class="print-pdf-link" href="/your/pdf.pdf">Print PDF</a>

我使用了javascript:

$('a.print-pdf-link').click(function () {
    var w = window.open($(this).attr('href'));

    w.onload = function () {
        w.print();
    };

    return false;
});