7

我有一个与 button 关联的 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

我怎样才能绕过这个特殊性？请帮助。

4

2 回答 2

6

这对我有用，不需要主机 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;
});
于 2014-03-07T22:51:20.367 回答
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

于 2013-02-21T15:06:05.627 回答