2

次のコード例を検討してください。

<!DOCTYPE html>
<html>
    <head>
        <title>HTML5-Template</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <style type="text/css">
            .print_this{
                display: none;
            }

            @media print {
                .print_this {
                    display: block;
                    width: 1024px;
                    height: 768px;
                }
            }
        </style>  
        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                setTimeout(function () {
                    var el = document.getElementById("report");
                    el.focus();
                    el.print();
                }, 1500);
            });
        </script>
    </head>
    <body>
        <div id="Container">
            <object class="print_this" id="report" name="report" type="application/pdf" data="Certificate.pdf"></object>
        </div>
    </body>
</html>

ウィンドウ内のユーザーからオブジェクトを非表示にしたいのですが、印刷ダイアログが表示されたときにタグの内容のみを印刷します...これは可能ですか？

注：コードはインターネット上の他の場所からのものでしたが、これは非常に標準に基づいていないように感じますか？

4

1 に答える 1

1

あなたは正しい方向に進んでいます。次に、印刷メディアブロック内で、画面のみのクラス（.screen_only { display: none; }）を定義して、プリンターに表示したくないものを非表示にする必要があります。

.print_this{
    display: none;
}

@media print {
    .print_this {
        display: block;
        width: 1024px;
        height: 768px;
    }
    .screen_only {
        display: none;
    }
}​

実用的な例については、 http：//fiddle.jshell.net/jhfrench/UdQSX/2/show/を参照してください。ページがブラウザに読み込まれると、「これは印刷時に表示されません」と表示されます。ページを印刷すると、「これはプリンタでのみ表示されます」と表示されます。

于 2013-01-03T15:13:59.520 に答える