2012-01-26 25 views
0

私は理解できないjavascriptの問題があります。私は hereを取得し、それをthisページで使用しているコードスニペットを撮影しました。IE7&IE8 javascript print function

ユーザーは[印刷リスト]ボタンをクリックすると、リストが非表示のiframe内のdivにコピーされて印刷されます。印刷されたページには、リストが正しく挿入されたiframeソースHTMLが含まれています。ただし、IE7 & 8では、印刷されたページはiframeではなく、完全な親ページです。 IE9、Chrome、FFの動作は正しいです。

スクリプトをデバッグしようとしましたが、どこが間違っているのかわかりませんでした。

はここで印刷リストのクリックをトリガーするコードです:

function printSection(id) { 
    if (document.getElementById('print_frame').contentDocument){ 
    theIframe = document.getElementById('print_frame').contentDocument; 
    } 
    else { 
    theIframe = document.frames['print_frame'].document; 
    } 
    var thePrinter = theIframe.getElementById('print_section'); 
    var theCopy = document.getElementById(id); 
    thePrinter.innerHTML = theCopy.innerHTML; 
    parent.print_frame.printPage(); 
} 

をそしてここでprintPage()関数です:

function printPage() { 
    window.parent.print_frame.focus(); 
    window.print(); 
} 

私は任意の助けをいただければと思います。詳しい情報が必要な場合はお知らせください。本当にありがとう。

答えて

1

単純な解決策は、CSSのメディアタイプを使用してページのコンテンツを非表示にし、印刷のために隠し要素を表示することです。

CSSの考えだ

.print{display:none;} 
@media print { 
    .pagecontainer{display:none;} 
    .print{display:block;} 
} 

HTML

<body> 
    <div class="pagecontainer"> 
     Page content here 
    </div> 
    <div class="print">Only show this when printing</div> 
</body> 
+0

。クロスブラウザでも動作しますか? – lancemonotone

+0

MDNは、Chrome 1.0、Firefox(Gecko)1.0(1.7)、Internet Explorer 9.0、Opera 9.2、Safari 1.3でサポートされているcssメディアタイプを示しています。 https://developer.mozilla.org/ja/CSS/@media –

+0

これは完璧でした。ありがとう。 – lancemonotone