4

ページ上のボタン/画像/リンクをクリックして、他の要素を印刷に含めたり除外したりすることはできますか? （実際のプリンターで）どの要素を印刷するかをユーザーに選択させたいと思います。これはJavascriptのjQueryで実現可能ですか?

理解を深めるために編集：各divの横に「これを印刷/印刷しない」ボタンを追加して、ページのどの部分を印刷するかをユーザーに選択させ、自分で設定したデフォルト設定を上書きしますprint.css ファイル。

更新: Richard Neil Ilagan の提案の後、私は次のことを試しました。助言がありますか？

<style type="text/css">
@media print { 
    .no-print { display:none; } 
}
</style>

<script>
$(document).ready(function() {
    $('.dontPrint').click(function() { $('maybe').addClass('no-print'); });
});
</script>

<img class="dontPrint" src="images/cancel.png" title="Dont print bla bla" /></a>
<div id="maybe">bla bla</div>
4

2 に答える 2

9

はい。@media printこれは、CSS のメディア タイプ セレクターを使用して行うことができます。例 (印刷時にすべての入力を非表示):

@media print {
    input {
        display: none;
    }
}

デザイン パターンとして、トグル効果を実現するために、印刷メディア セレクターを残りのスタイルシートと組み合わせることができます。

HTML:

<div class="for-screen">
    <input type="submit" value="Shown when not printing">
</div>
<div class="for-print">
    <p>Shown instead when printing</p>
</div>

CSS:

.for-screen {display: block;}
.for-print {display: none;}

@media print {
    .for-screen {display: none;}
    .for-print {display: block;}
}

この問題に関するその他の情報:

于 2012-06-18T15:42:35.373 に答える
1

cssで設定する必要があります。

メディア="印刷"

次のようなことを試してください：

<link rel="stylesheet" type="text/css" media="print" href="print.css" />
于 2012-06-18T15:44:41.563 に答える