web-dev-qa-db-ja.com

印刷方法PDF IFRAMEからsrc = pdfの場合?

PDFファイル(PDFのページではなく))を直接ポイントする必要があるiframeがあります。

<iframe id="ecard-pdf" name="ecard-pdf" style="position: absolute;" src="/profile.pdf">
</iframe>

PDFこのiFrameに印刷できるようにしたい

他の質問で、自分のニーズに合わないいくつかの解決策を見つけました。

  1. Iframe内に関数が必要( https://stackoverflow.com/a/473270/1246369
  2. フレームに焦点を合わせて、それに印刷アクションを実行することを提案します( https://stackoverflow.com/a/9616706/1246369
  3. IframeのcontentWindowにアクセスして印刷します( https://stackoverflow.com/a/9617566/1246369
  4. それらのバリエーション

ただし、FireFoxとIEは、iframeのsrcが直接PDFを指しており、PDFで囲まれたページを指していない場合、これを行うことができないようです。

Firefox

印刷する代わりに、このダイアログを表示します。「このページが追加のダイアログを作成しないようにする」と「OK」ボタンと「キャンセル」ボタンがあり、どちらもPDFを印刷しません。

[〜#〜] ie [〜#〜]

上記の方法を使用して印刷しようとする試みを無視します。

質問

どのブラウザを使用していても、ユーザーがPDFをiFrameに印刷できるようにするにはどうすればよいですか?

22
Asu

IEとChromeの両方で機能する解決策を見つけるのに少し苦労しました。これは私にとっては機能します:

$(function() {
    var ua = window.navigator.userAgent;
    var msie = ua.indexOf('MSIE ');
    var trident = ua.indexOf('Trident/');
    var Edge = ua.indexOf('Edge/');
    var url = '/url/to/file.pdf';
    var pdf ='';
    var style = 'position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden;';

    if(msie > 0 || trident > 0 || Edge > 0){
        pdf = '<object data="' + url + '" name="print_frame" id="print_frame" style="' + style + '" type="application/pdf">';
    }
    else{
        pdf ='<iframe src="' + url + '" name="print_frame" id="print_frame" style="' + style + '"></iframe>';
    }

    $(document.body).append(pdf);

    setTimeout(function(){
        window.frames["print_frame"].focus();
        window.frames["print_frame"].print();
    },2000);
});

...乾杯。

4
Svela

同様の質問 のこの回答で示唆されているように、これを行うことができます:

window.frames.pdfFrame.print();

これで問題が解決するはずです。

1
bdadam

これは機能しているようです:

   <style type="text/css" media="print">
   body *{display:none}
   iframe{display:block}
   </style>

それでは、pdfだけが表示されますか?

0
Neutrino

オプション1:

私はこれをテストしていませんが、ここで別の答えを見つけました: https://stackoverflow.com/a/4096547/2528978

以下を使用できると仮定します。

<style type="text/css" media="print">
   body *{display:none}
   iframe{display:block}
</style>

それでは、pdfだけが表示されますか?

オプション2:

「Print me」というPDFファイルへのハイパーリンクを作成します

<a href='Path/To/PDF'>Print Me</a>

お役に立てれば...

-アンドリュー

0
Android334