88

私のアプリケーションでは、次のようなユーザー向けのバウチャー ページを印刷しようとしました。

  var htm ="<div>Voucher Details</div>";
  $('#divprint').html(htm);
  window.setTimeout('window.print()',2000);

' divprint' はdivバウチャーに関する情報を保存するマイ ページ内の です。

動作し、印刷ページがポップアップします。しかし、ユーザーがブラウザのポップアップ印刷ダイアログで「 print」または「 」をクリックしたら、アプリケーションを進めたいと思います。close

たとえば、ポップアップ ウィンドウが閉じられた後、ユーザーを別のページにリダイレクトしたいと思います。

window.application.directtoantherpage();//a function which direct user to other page

ポップアップ印刷ウィンドウが閉じられたとき、または印刷が終了したときを確認するにはどうすればよいですか?

4

15 に答える 15

135

アフタープリントイベントを聞くことができます。

https://developer.mozilla.org/en-US/docs/Web/API/window.onafterprint

window.onafterprint = function(){
   console.log("Printing completed...");
}

window.matchMedia を使用して、この機能を別の方法で取得できる場合があります。

(function() {

    var beforePrint = function() {
        console.log('Functionality to run before printing.');
    };

    var afterPrint = function() {
        console.log('Functionality to run after printing');
    };

    if (window.matchMedia) {
        var mediaQueryList = window.matchMedia('print');
        mediaQueryList.addListener(function(mql) {
            if (mql.matches) {
                beforePrint();
            } else {
                afterPrint();
            }
        });
    }

    window.onbeforeprint = beforePrint;
    window.onafterprint = afterPrint;

}());

ソース: http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/

于 2013-08-20T01:09:22.470 に答える
65

クロム（V.35.0.1916.153 m）でこれを試してください：

function loadPrint() {
    window.print();
    setTimeout(function () { window.close(); }, 100);
}

私にとってはうまくいきます。ユーザーが印刷ダイアログでの作業を終了すると、ウィンドウが閉じます。

于 2014-06-20T10:26:04.193 に答える
11

chrome、firefox、opera、Internet Explorer と互換性があります
注: jQuery が必要です。

<script>

    window.onafterprint = function(e){
        $(window).off('mousemove', window.onafterprint);
        console.log('Print Dialog Closed..');
    };

    window.print();

    setTimeout(function(){
        $(window).one('mousemove', window.onafterprint);
    }, 1);

</script>
于 2016-02-16T10:42:31.423 に答える
4

window.print() を別の関数に入れるだけで、いつ終了したかを検出できます

//function to call if you want to print
var onPrintFinished=function(printed){console.log("do something...");}

//print command
onPrintFinished(window.print());

Firefox、Google chrome、IE でテスト済み

于 2013-11-21T12:28:59.037 に答える
4

https://stackoverflow.com/a/15662720/687315を参照してください。回避策として、afterPrintウィンドウ (Firefox および IE) でイベントをリッスンし、ドキュメント上でのマウスの動き (ユーザーが印刷ダイアログを閉じてページに戻ったことを示す) をリッスンしてから、window.mediaMatchAPI がメディアが存在しないことを示した後、より長くは "print" に一致します (Firefox および Chrome)。

ユーザーが実際にドキュメントを印刷した場合としない場合があることに注意してください。また、window.print()Chrome で頻繁に呼び出しを行うと、ユーザーは印刷を求められることさえない可能性があります。

于 2013-08-20T01:09:29.803 に答える
2

印刷ダイアログが消えるのを待ちたい場合は、ウィンドウでフォーカスバインディングを使用します。

print();

var handler = function(){
    //unbind task();
    $(window).unbind("focus",handler);
}

$(window).bind("focus",handler);

ハンドラー関数に unbind を入れることで、フォーカス イベントがウィンドウに結合したままになるのを防ぎます。

于 2016-05-12T14:30:37.257 に答える
1

テスト済みの IE、FF、Chrome ですべて動作します。

    setTimeout(function () { window.print(); }, 500);
    window.onfocus = function () { setTimeout(function () { window.close(); }, 500); }
于 2016-02-29T21:55:13.840 に答える
1

w = window.open(url, '_blank') を使用して新しいウィンドウに印刷し、 w.focus();w.close(); を試してください。ページが閉じられたことを検出します。すべてのブラウザで動作します。

w = window.open(url, '_blank');
w.onunload = function(){
 console.log('closed!');
}
w.focus();
w.print();
w.close();

印刷終了後、ウィンドウを閉じます。

于 2014-06-23T19:06:49.777 に答える
0

印刷が終了したかどうかを検出して印刷ウィンドウを閉じる最も簡単な方法:

window.onafterprint = function(){ 
  window.onfocus = function(){  
    window.close();
  }
};
于 2021-09-15T11:13:00.193 に答える
0

ウィンドウフォーカスアプローチは正しいと思います。非表示の iframe で PDF url blob を開いて印刷したい例を次に示します。印刷またはキャンセルした後、iframe を削除したいと思いました。

/**
 * printBlob will create if not exists an iframe to load
 * the pdf. Once the window is loaded, the PDF is printed.
 * It then creates a one-time event to remove the iframe from
 * the window.
 * @param {string} src Blob or any printable url.
 */
export const printBlob = (src) => {
  if (typeof window === 'undefined') {
    throw new Error('You cannot print url without defined window.');
  }
  const iframeId = 'pdf-print-iframe';
  let iframe = document.getElementById(iframeId);
  if (!iframe) {
    iframe = document.createElement('iframe');
    iframe.setAttribute('id', iframeId);
    iframe.setAttribute('style', 'position:absolute;left:-9999px');
    document.body.append(iframe);
  }
  iframe.setAttribute('src', src);
  iframe.addEventListener('load', () => {
    iframe.contentWindow.focus();
    iframe.contentWindow.print();
    const infanticide = () => {
      iframe.parentElement.removeChild(iframe);
      window.removeEventListener('focus', infanticide);
    }
    window.addEventListener('focus', infanticide);
  });
};
于 2017-08-11T00:23:58.987 に答える