Window.printはGoogle Chromeで不適切なコンテンツを表示します

-1

JavaScriptを使用してモーダルページのコンテンツを変更すると、Google Chromeで正しいコンテンツが印刷されないことがあります。これは私のコードです：Window.printはGoogle Chromeで不適切なコンテンツを表示します

Javascriptを：

function printCoupon(couponID) 
{ 
    var originalContents = document.body.innerHTML; 
    var printable = document.getElementById(couponID); 
    var printContents = printable.innerHTML; 

    document.body.innerHTML = printContents; 

    window.print(); 

    document.body.innerHTML = originalContents; 
}

HTML：

<body> 
    <div id="coupon1"><p>Coupon 1 contents</p></div> 
    <div><a href="javascript:void(0)" onclick="printCoupon('coupon1');return false;">Print Coupon</a></div> 
    <div id="coupon2"><p>Coupon 2 contents</p></div> 
    <div><a href="javascript:void(0)" onclick="printCoupon('coupon2');return false;">Print Coupon</a></div> 
</body>

これはIE8で動作し、FF 3.6が、クロム16プリントのオリジナルコンテンツを、ない印刷可能コンテンツ。

更新：私はちょうどこれに別の問題を発見しました。 IE9では、モーダルだけでなく、モーダルと一緒に親ページが印刷されます（モーダルは透明に見えます）。

出典

2012-01-18 gr8dane

-1

私は両方の私の問題への答えを見つけました。解決策は、スクリプトを3つのスクリプト（印刷前、印刷中および印刷後）に分割し、2番目の2つでsetTimeoutを使用することでした。それは今、完璧に動作します。

出典

2012-01-20 01:32:11 gr8dane

元のinnerHTMLを再割り当てすると、印刷ジョブはまだ送信されていないと思います。

私はCSS-ソリューションを好むだろう：

CSS：

@media print{ 
body > div{display:none;} 
.printable{display:block !important} 
}

JSは：

function printCoupon(couponID) 
{ 
    if(window['printable']) 
    { 
    window['printable'].className=''; 
    } 
    window['printable']=document.getElementById(couponID); 
    window['printable'].className='printable'; 
    window.print(); 
}

出典

2012-01-18 22:41:09

お返事ありがとうございます。残念ながら、これにはいくつかの問題があります。まず、本文のすべてをdivの内容に置き換える必要があります。これはdivに新しいクラス名を与え、それ以外のものはすべて残しておきます。次に、Chromeで印刷プレビューが失敗するようになりました。 – gr8dane

なぜすべてを交換する必要がありますか？ –

選択したクーポンのみが印刷されるようにします。このページには多数のクーポンが掲載されています。 – gr8dane

Window.printはGoogle Chromeで不適切なコンテンツを表示します

答えて

関連する問題